Created
January 14, 2013 12:32
-
-
Save johnnyreilly/4529746 to your computer and use it in GitHub Desktop.
Twitter.Bootstrap.MVC4 meet Bootstrap Datepicker
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
using System.Web; | |
using System.Web.Mvc; | |
using System.Web.Optimization; | |
namespace BootstrapSupport | |
{ | |
public class BootstrapBundleConfig | |
{ | |
public static void RegisterBundles(BundleCollection bundles) | |
{ | |
bundles.Add(new ScriptBundle("~/js").Include( | |
"~/Scripts/jquery-1.*", | |
"~/Scripts/bootstrap.js", | |
"~/Scripts/bootstrap-datepicker.js", // ** NEW for Bootstrap Datepicker | |
"~/Scripts/jquery.validate.js", | |
"~/scripts/jquery.validate.unobtrusive.js", | |
"~/Scripts/jquery.validate.unobtrusive-custom-for-bootstrap.js" | |
)); | |
bundles.Add(new StyleBundle("~/content/css").Include( | |
"~/Content/bootstrap.css", | |
"~/Content/bootstrap-datepicker.css" // ** NEW for Bootstrap Datepicker | |
)); | |
bundles.Add(new StyleBundle("~/content/css-responsive").Include( | |
"~/Content/bootstrap-responsive.css" | |
)); | |
} | |
} | |
} |
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
@using BootstrapSupport | |
@model Object | |
@using (Html.BeginForm()) | |
{ | |
@Html.ValidationSummary(true) | |
<fieldset class="form-horizontal"> | |
<legend>@Model.GetLabel() <small>Details</small></legend> | |
@foreach (var property in Model.VisibleProperties()) | |
{ | |
@Html.BeginControlGroupFor(property.Name) | |
@Html.Label(property.Name.ToSeparatedWords(), new { @class = "control-label" }) | |
<div class="controls"> | |
@Html.Editor(property.Name, new { @class = "input-xlarge" }) | |
@Html.ValidationMessage(property.Name, null, new { @class = "help-inline" }) | |
</div> | |
@Html.EndControlGroup() | |
} | |
<div class="form-actions"> | |
<button type="submit" class="btn btn-primary">Save changes</button> | |
@Html.ActionLink("Cancel", "Index", null, new {@class = "btn "}) | |
</div> | |
</fieldset> | |
} | |
<div> | |
@Html.ActionLink("Back to List", "Index") | |
</div> | |
@section Scripts { | |
<script type="text/javascript"> | |
$('.datepicker').datepicker(); //Initialise any date pickers | |
</script> | |
} |
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
@model DateTime? | |
@Html.TextBox("", (Model.HasValue ? Model.Value.ToShortDateString() : string.Empty), new { | |
@class = "datepicker", | |
data_date_format = System.Globalization.CultureInfo.CurrentCulture.DateTimeFormat.ShortDatePattern.ToLower() | |
}) |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
Looks cool thanks for sharing! Where does the Date.cshtml go? How does that come into play?
UPDATE: 5 seconds after posting this I found your blog article on the topic and was able to get it working. Nicely done.
-J