Bootstrap-MVC

BlankMVCProject/BlankMVCProject.sln

@@ -3,6 +3,8 @@ Microsoft Visual Studio Solution File, Format Version 11.00
 # Visual Studio 2010
 Project("{FAE04EC0-301F-11D3-BF4B-00C04F79EFBC}") = "BlankMVCProject", "BlankMVCProject\BlankMVCProject.csproj", "{4A957ECA-37F7-4308-A923-195A152EA351}"
 EndProject
+Project("{FAE04EC0-301F-11D3-BF4B-00C04F79EFBC}") = "Twitter.Bootstrap.Utils", "Twitter.Bootstrap.Utils\Twitter.Bootstrap.Utils.csproj", "{C9210E43-2FDC-4154-A3CC-11FC712ABA3F}"
+EndProject
 Global
 	GlobalSection(SolutionConfigurationPlatforms) = preSolution
 		Debug|Any CPU = Debug|Any CPU
@@ -13,6 +15,10 @@ Global
 		{4A957ECA-37F7-4308-A923-195A152EA351}.Debug|Any CPU.Build.0 = Debug|Any CPU
 		{4A957ECA-37F7-4308-A923-195A152EA351}.Release|Any CPU.ActiveCfg = Release|Any CPU
 		{4A957ECA-37F7-4308-A923-195A152EA351}.Release|Any CPU.Build.0 = Release|Any CPU
+		{C9210E43-2FDC-4154-A3CC-11FC712ABA3F}.Debug|Any CPU.ActiveCfg = Debug|Any CPU
+		{C9210E43-2FDC-4154-A3CC-11FC712ABA3F}.Debug|Any CPU.Build.0 = Debug|Any CPU
+		{C9210E43-2FDC-4154-A3CC-11FC712ABA3F}.Release|Any CPU.ActiveCfg = Release|Any CPU
+		{C9210E43-2FDC-4154-A3CC-11FC712ABA3F}.Release|Any CPU.Build.0 = Release|Any CPU
 	EndGlobalSection
 	GlobalSection(SolutionProperties) = preSolution
 		HideSolutionNode = FALSE

BlankMVCProject/BlankMVCProject/BlankMVCProject.csproj

@@ -72,10 +72,10 @@
   </ItemGroup>
   <ItemGroup>
     <Content Include="Content\bootstrap-overrides.css" />
+    <Content Include="Content\bootstrap-responsive.css" />
+    <Content Include="Content\bootstrap-responsive.min.css" />
     <Content Include="Content\bootstrap.css" />
     <Content Include="Content\bootstrap.min.css" />
-    <Content Include="Content\bootstrap.min.responsive.css" />
-    <Content Include="Content\bootstrap.responsive.css" />
     <Content Include="Content\images\glyphicons-halflings-white.png" />
     <Content Include="Content\images\glyphicons-halflings.png" />
     <Content Include="Content\themes\base\images\ui-bg_flat_0_aaaaaa_40x100.png" />
@@ -136,14 +136,19 @@
     <Content Include="Content\themes\base\minified\jquery.ui.theme.min.css" />
     <Content Include="Global.asax" />
     <Content Include="README.jQuery.vsdoc.txt" />
+    <Content Include="Scripts\bootstrap-datepicker-format.js" />
+    <Content Include="Scripts\bootstrap-datepicker.js" />
+    <Content Include="Scripts\bootstrap.jquery.dataTables.js" />
     <Content Include="Scripts\bootstrap.js" />
     <Content Include="Scripts\bootstrap.min.js" />
     <Content Include="Scripts\jquery-1.7.1-vsdoc.js" />
     <Content Include="Scripts\jquery-1.7.1.js" />
     <Content Include="Scripts\jquery-1.7.1.min.js" />
     <Content Include="Scripts\jquery-ui-1.8.17.js" />
     <Content Include="Scripts\jquery-ui-1.8.17.min.js" />
+    <Content Include="Scripts\jquery.dataTables.min.js" />
     <Content Include="Scripts\jquery.validate-vsdoc.js" />
+    <Content Include="Scripts\jquery.validate.bootstrap.js" />
     <Content Include="Scripts\jquery.validate.js" />
     <Content Include="Scripts\jquery.validate.min.js" />
     <Content Include="Scripts\modernizr-2.0.6-development-only.js" />
@@ -211,7 +216,18 @@
     <None Include="CodeTemplates\AddView\CSHTML\Details.tt" />
     <None Include="CodeTemplates\AddView\CSHTML\Edit.tt" />
     <None Include="CodeTemplates\AddView\CSHTML\Empty.tt" />
+    <None Include="CodeTemplates\AddView\CSHTML\List-DataTables.tt" />
     <None Include="CodeTemplates\AddView\CSHTML\List.tt" />
+    <Content Include="Views\Shared\EditorTemplates\Boolean.cshtml" />
+    <Content Include="Views\Shared\EditorTemplates\DateTime.cshtml" />
+    <Content Include="Views\Shared\EditorTemplates\Decimal.cshtml" />
+    <Content Include="Views\Shared\EditorTemplates\String.cshtml" />
+  </ItemGroup>
+  <ItemGroup>
+    <ProjectReference Include="..\Twitter.Bootstrap.Utils\Twitter.Bootstrap.Utils.csproj">
+      <Project>{C9210E43-2FDC-4154-A3CC-11FC712ABA3F}</Project>
+      <Name>Twitter.Bootstrap.Utils</Name>
+    </ProjectReference>
   </ItemGroup>
   <Import Project="$(MSBuildBinPath)\Microsoft.CSharp.targets" />
   <Import Project="$(MSBuildExtensionsPath32)\Microsoft\VisualStudio\v10.0\WebApplications\Microsoft.WebApplication.targets" />

BlankMVCProject/BlankMVCProject/CodeTemplates/AddView/CSHTML/Create.tt

@@ -4,16 +4,21 @@
 <#@ assembly name="System.Core" #>
 <#@ assembly name="System.Data.Entity" #>
 <#@ assembly name="System.Data.Linq" #>
+<#@ assembly name="System.Web.Mvc" #>
+<#@ assembly name="Twitter.Bootstrap.Utils" #>
 <#@ import namespace="System" #>
 <#@ import namespace="System.Collections.Generic" #>
 <#@ import namespace="System.ComponentModel.DataAnnotations" #>
 <#@ import namespace="System.Data.Linq.Mapping" #>
 <#@ import namespace="System.Data.Objects.DataClasses" #>
 <#@ import namespace="System.Linq" #>
 <#@ import namespace="System.Reflection" #>
+<#@ import namespace="System.Web.Mvc" #>
+<#@ import namespace="Twitter.Bootstrap.Utils.Attributes" #>
 <#
 MvcTextTemplateHost mvcHost = (MvcTextTemplateHost)(Host);
 #>
+@using Twitter.Bootstrap.Utils.Extensions
 @model <#= mvcHost.ViewDataTypeName #>
 <#
 // The following chained if-statement outputs the file header code and markup for a partial view, a content page, or a regular view.
@@ -25,7 +30,7 @@ if(mvcHost.IsPartialView) {
 #>
 
 @{
-    ViewBag.Title = "<#= mvcHost.ViewName#>";
+    ViewBag.Title = "<#= mvcHost.ViewName + " " + mvcHost.ViewDataType.Name#>";
 <#
 if (!String.IsNullOrEmpty(mvcHost.MasterPageFile)) {
 #>
@@ -34,10 +39,6 @@ if (!String.IsNullOrEmpty(mvcHost.MasterPageFile)) {
 }
 #>
 }
-
-<div class="page-header">
-	<h2><#= mvcHost.ViewName#></h2>
-</div>
 <#
 } else {
 #>
@@ -50,11 +51,9 @@ if (!String.IsNullOrEmpty(mvcHost.MasterPageFile)) {
 
 <html>
 <head>
-    <title><#= mvcHost.ViewName #></title>
+    <title><#= mvcHost.ViewName + " " + mvcHost.ViewDataType.Name#></title>
 </head>
 <body>
-	<div class="page-header">
-	</div>
 <#
     PushIndent("    ");
 }
@@ -71,23 +70,33 @@ if (mvcHost.ReferenceScriptLibraries) {
 #>
 <script src="@Url.Content("~/Scripts/jquery.validate.min.js")" type="text/javascript"></script>
 <script src="@Url.Content("~/Scripts/jquery.validate.unobtrusive.min.js")" type="text/javascript"></script>
-
+<script src="@Url.Content("~/Scripts/jquery.validate.bootstrap.js")" type="text/javascript"></script>
 <#
 }
 #>
-@using (Html.BeginForm()) {
+<script src="@Url.Content("~/Scripts/bootstrap-datepicker.js")" type="text/javascript"></script>
+<script src="@Url.Content("~/Scripts/bootstrap-datepicker-format.js")" type="text/javascript"></script>
+
+@using (Html.BootstrapBeginForm("form-horizontal")) {
     @Html.ValidationSummary(true)
     <fieldset>
-        <legend><#= mvcHost.ViewDataType.Name #></legend>
+        <legend><#= mvcHost.ViewName + " " + mvcHost.ViewDataType.Name #></legend>
 <#
 foreach (ModelProperty property in GetModelProperties(mvcHost.ViewDataType)) {
     if (!property.IsPrimaryKey && !property.IsReadOnly) {
 #>
         <div class="control-group">
-            @Html.LabelFor(model => model.<#= property.Name #>)
+            @Html.BootstrapLabelFor(model => model.<#= property.Name #>)
 			<div class="controls">
 				@Html.EditorFor(model => model.<#= property.Name #>)
-				@Html.ValidationMessageFor(model => model.<#= property.Name #>)
+				@Html.BootstrapValidationMessageFor(model => model.<#= property.Name #>)
+<#
+if (!string.IsNullOrEmpty(property.HelperText)) {
+#>
+				@Html.BootstrapFormHelpTextBlockFor(model => model.<#= property.Name #>)
+<#
+}
+#>
 			</div>
 		</div>
 
@@ -97,15 +106,13 @@ foreach (ModelProperty property in GetModelProperties(mvcHost.ViewDataType)) {
 #>
 		<div class="form-actions">
 			<input type="submit" class="btn btn-primary" value="Create" />
+			@Html.ActionLink("Cancel", "Index", null, new {@class = "btn"})
 		</div>
     </fieldset>
 
 
 }
 
-<div>
-	@Html.ActionLink("Back to List", "Index")
-</div>
 <#
 // The following code closes the asp:Content tag used in the case of a master page and the body and html tags in the case of a regular view page
 #>
@@ -127,6 +134,7 @@ class ModelProperty {
     public Type UnderlyingType { get; set; }
     public bool IsPrimaryKey { get; set; }
     public bool IsReadOnly { get; set; }
+	public string HelperText { get; set; }
 }
 
 // Change this list to include any non-primitive types you think should be eligible for display/edit
@@ -137,6 +145,7 @@ static Type[] bindableNonPrimitiveTypes = new[] {
     typeof(DateTime),
     typeof(DateTimeOffset),
     typeof(TimeSpan),
+	typeof(bool)
 };
 
 // Call this to get the list of properties in the model. Change this to modify or add your
@@ -151,6 +160,9 @@ List<ModelProperty> GetModelProperties(Type type) {
         else if (prop.UnderlyingType == typeof(DateTime)) {
             prop.ValueExpression = "String.Format(\"{0:g}\", " + prop.ValueExpression + ")";
         }
+		else if (prop.UnderlyingType == typeof(bool)) {
+			prop.HelperText = String.Empty; // Checkboxes are handled differently - see EditorTemplates\Boolean.cshtml
+		}
     }
 
     return results;
@@ -210,7 +222,8 @@ List<ModelProperty> GetEligibleProperties(Type type) {
                 ValueExpression = "Model." + prop.Name,
                 UnderlyingType = underlyingType,
                 IsPrimaryKey = IsPrimaryKey(prop),
-                IsReadOnly = prop.GetSetMethod() == null
+                IsReadOnly = prop.GetSetMethod() == null,
+				HelperText = GetHelperText(prop)
             });
         }
     }
@@ -222,4 +235,21 @@ List<ModelProperty> GetEligibleProperties(Type type) {
 bool IsBindableType(Type type) {
     return type.IsPrimitive || bindableNonPrimitiveTypes.Contains(type);
 }
+
+// Helper
+string GetHelperText(PropertyInfo property) {
+	string helperText = String.Empty;
+
+	foreach (object attribute in property.GetCustomAttributes(true)) {
+        if (attribute is HelperTextAttribute) {  // Bootstrap helper text
+			HelperTextAttribute helper = attribute as HelperTextAttribute;
+		    if (helper != null) {
+				helperText = helper.HelperText;
+			}
+        }
+
+    }
+
+	return helperText;
+}
 #>

BlankMVCProject/BlankMVCProject/CodeTemplates/AddView/CSHTML/Delete.tt

@@ -25,7 +25,7 @@ if(mvcHost.IsPartialView) {
 #>
 
 @{
-    ViewBag.Title = "<#= mvcHost.ViewName#>";
+    ViewBag.Title = "<#= mvcHost.ViewName + " " + mvcHost.ViewDataType.Name#>";
 <#
 if (!String.IsNullOrEmpty(mvcHost.MasterPageFile)) {
 #>
@@ -34,10 +34,6 @@ if (!String.IsNullOrEmpty(mvcHost.MasterPageFile)) {
 }
 #>
 }
-<div class="page-header">
-	<h2><#= mvcHost.ViewName#></h2>
-</div>
-
 <#
 } else {
 #>
@@ -50,44 +46,42 @@ if (!String.IsNullOrEmpty(mvcHost.MasterPageFile)) {
 
 <html>
 <head>
-    <title><#= mvcHost.ViewName #></title>
+    <title><#= mvcHost.ViewName + " " + mvcHost.ViewDataType.Name#></title>
 </head>
 <body>
-	<div class="page-header">
-	</div>
 <#
     PushIndent("    ");
 }
-#>
-	<h3>Are you sure you want to delete this?</h3>
-	@using (Html.BeginForm()) {
-		<div>
-			<fieldset>
-				<legend><#= mvcHost.ViewDataType.Name #></legend>
-				<br />
+#>	
+<script src="@Url.Content("~/Scripts/bootstrap.min.js")" type="text/javascript"></script>
+
+@using (Html.BeginForm()) {
+	<fieldset>
+		<legend><#= mvcHost.ViewName + " " + mvcHost.ViewDataType.Name#></legend>		
+		<div class="alert alert-block">
+			<a class="close" data-dismiss="alert">×</a>
+			<h4 class="alert-heading">Warning!</h4>
+			Are you sure you want to delete this?
+		</div>
 <#
 foreach (ModelProperty property in GetModelProperties(mvcHost.ViewDataType)) {
     if (!property.IsPrimaryKey) {
 #>
-            <div class="row">
-                <div class="span2">@Html.LabelFor(model => model.<#= property.Name #>)</div>
-                <div class="span10">@Html.DisplayFor(model => model.<#= property.Name #>)</div>
-            </div>
+        <div class="row">
+            <div class="span2">@Html.LabelFor(model => model.<#= property.Name #>)</div>
+            <div class="span10">@Html.DisplayFor(model => model.<#= property.Name #>)</div>
+        </div>
 
 <#
     }
 }
 #>
-			<div class="form-actions">
-				<input type="submit" class="btn btn-primary" value="Delete" />
-			</div>
-		</fieldset>
-		<br />
-	</div>
-	}
-<div>
-	@Html.ActionLink("Back to List", "Index")
-</div>
+		<div class="form-actions">
+			<input type="submit" class="btn btn-danger" value="Delete" />
+			@Html.ActionLink("Cancel", "Index", null, new {@class = "btn"})
+		</div>
+	</fieldset>
+}
 <#
 // The following code closes the asp:Content tag used in the case of a master page and the body and html tags in the case of a regular view page
 #>

BlankMVCProject/BlankMVCProject/CodeTemplates/AddView/CSHTML/Details.tt

@@ -25,7 +25,7 @@ if(mvcHost.IsPartialView) {
 #>
 
 @{
-    ViewBag.Title = "<#= mvcHost.ViewName#>";
+    ViewBag.Title = "<#= mvcHost.ViewDataType.Name + " " + mvcHost.ViewName#>";
 <#
 if (!String.IsNullOrEmpty(mvcHost.MasterPageFile)) {
 #>
@@ -34,11 +34,6 @@ if (!String.IsNullOrEmpty(mvcHost.MasterPageFile)) {
 }
 #>
 }
-
-<div class="page-header">
-	<h2><#= mvcHost.ViewName#></h2>
-</div>
-
 <#
 } else {
 #>
@@ -51,18 +46,15 @@ if (!String.IsNullOrEmpty(mvcHost.MasterPageFile)) {
 
 <html>
 <head>
-    <title><#= mvcHost.ViewName #></title>
+    <title><#= mvcHost.ViewDataType.Name + " " + mvcHost.ViewName#></title>
 </head>
 <body>
-<div class="page-header">
-</div>
 <#
     PushIndent("    ");
 }
 #>
 		<fieldset>
-			<legend><#= mvcHost.ViewDataType.Name #></legend>
-			<br />
+			<legend><#= mvcHost.ViewDataType.Name + " " + mvcHost.ViewName#></legend>		
 <#
 foreach (ModelProperty property in GetModelProperties(mvcHost.ViewDataType)) {
     if (!property.IsPrimaryKey) {
@@ -83,18 +75,21 @@ foreach (ModelProperty property in GetModelProperties(mvcHost.ViewDataType)) {
 string pkName = GetPrimaryKeyName(mvcHost.ViewDataType);
 if (pkName != null) {
 #>
-		@Html.ActionLink("Edit", "Edit", new { id=Model.<#= pkName #> }) |
-		@Html.ActionLink("Back to List", "Index")
+	<div class="form-actions">
+		@Html.ActionLink("Edit", "Edit", new { id=Model.<#= pkName #> }, new { @class = "btn btn-primary" })
+		@Html.ActionLink("Cancel", "Index", null, new {@class = "btn"})	
+	</div>
 <#
 } else {
 #>
-		@Html.ActionLink("Edit", "Edit", new { /* id=Model.PrimaryKey */ }) |
-		@Html.ActionLink("Back to List", "Index")
+	<div class="form-actions">
+		@Html.ActionLink("Edit", "Edit", new { /* id=Model.PrimaryKey */ }, new {@class = "btn btn-primary"} )
+		@Html.ActionLink("Cancel", "Index", null, new {@class = "btn"})		
+	</div>
 <#
 }
 #>
 	</p>
-</div>
 <#
 if(!mvcHost.IsPartialView && !mvcHost.IsContentPage) {
     ClearIndent();