How do i Implement JqueryUI Datepicker - asp.net-mvc

How do i Implement a DateTime Picker from the library of JqueryUI Datepicker.
So far i have folowed these steps http://blog.falafel.com/three-steps-use-jquery-ui-asp-net-mvc-5/
Where i have done the first 3 Steps, and now i dont now how to move on so i can Implement the DateTime Picker?
What i have coded so far is my datetime Variable in the Model Class, like this
[DataType(DataType.Date)]
public DateTime Date { get; set; }
And in my Create view i have this
#using (Html.BeginForm())
{
#Html.AntiForgeryToken()
<div class="form-horizontal">
<h4>Job</h4>
<hr />
#Html.ValidationSummary(true, "", new { #class = "text-danger" })
<div class="form-group">
#Html.LabelFor(model => model.Date, "Choose Date", htmlAttributes: new { #class = "control-label col-md-2" })
<div class="col-md-1">
#Html.EditorFor(model => model.Date, new { htmlAttributes = new { #class = "form-control" } })
#Html.ValidationMessageFor(model => model.Date, "", new { #class = "text-danger" })
</div>
</div>
</div>
}
In my BundleConfig class i have i have implemented
bundles.Add(new ScriptBundle("~/bundles/jqueryui").Include(
"~/Scripts/jquery-ui-{version}.js"));
bundles.Add(new StyleBundle("~/Content/themes/base/css").Include(
"~/Content/themes/base/jquery.ui.core.css",
"~/Content/themes/base/jquery.ui.datepicker.css",
"~/Content/themes/base/jquery.ui.theme.css"));
and in the _Layout.cshtml i have implemented
#Scripts.Render("~/bundles/jqueryui")

You'll need to add some pure javascript code, like this: http://jqueryui.com/datepicker/ (click on view source).
<script>
$(function() {
$( "#datepicker" ).datepicker();
});
</script>
instead of "#datepicker" you need to use id of your date edit or ".form-control" for all edits which are have such class name

My Entire _Layout class, this is right, right?
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>#ViewBag.Title - My ASP.NET Application</title>
#Styles.Render("~/Content/css")
#Scripts.Render("~/bundles/modernizr")
<meta name="description" content="The description of my page" />
</head>
<body>
<div class="navbar navbar-inverse navbar-fixed-top">
<div class="container">
<div class="navbar-header">
<button type="button" class="navbar-toggle" data-toggle="collapse" data-target=".navbar-collapse">
<span class="icon-bar"></span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
</button>
#Html.ActionLink("Substi", "Index", "Home", new { area = "" }, new { #class = "navbar-brand" })
</div>
<div class="navbar-collapse collapse">
<ul class="nav navbar-nav">
<li>#Html.ActionLink("Home", "ChooseTeacher", "Substitutes")</li>
<li>#Html.ActionLink("All Schools", "Index", "Schools")</li>
<li>#Html.ActionLink("All Teachers", "Index", "Teachers")</li>
<li>#Html.ActionLink("Contact", "Contact", "Home")</li>
<li>#Html.ActionLink("About", "About", "Home")</li>
</ul>
#Html.Partial("_LoginPartial")
</div>
</div>
</div>
<div class="container body-content">
#RenderBody()
<hr />
<footer>
<p>© #DateTime.Now.Year - My ASP.NET Application</p>
</footer>
</div>
#Scripts.Render("~/bundles/jquery")
#Scripts.Render("~/bundles/bootstrap")
#Scripts.Render("~/bundles/jqueryui")
#RenderSection("scripts", required: false)
</body>
</html>

Related

Web page stripped away from "layout" after adding paging through "PagedList.Mvc"

I wanted to add paging to my website so I installed the "PagedList.Mvc"
then I made some changes to model like for example changing the type from IEnumerable to IPagedList :
public IPagedList <Product> Products.
but I don't think changing model property has anything to do with the problem of layout disappearance.
And in controller part, I just added some properties to send through ViewModel to "Index" page, which I don't think has anything to do with the main problem.
i also added some <p> and <div> elements to the "Index" page which i don't think it has anything to do with layout problem since its universal to all pages.
I didn't touch the _layout.cshtml page :
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>#ViewBag.Title - My ASP.NET Application</title>
#Styles.Render("~/Content/css")
#Scripts.Render("~/bundles/modernizr")
</head>
<body>.
<div class="navbar navbar-inverse navbar-fixed-top">
<div class="container">
<div class="navbar-header">
<button type="button" class="navbar-toggle" data-
toggle="collapse" data-target=".navbar-collapse">
<span class="icon-bar"></span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
</button>
#Html.ActionLink("Application name", "Index", "Home", new { area
= "" }, new { #class = "navbar-brand" })
</div>
<div class="navbar-collapse collapse">
<ul class="nav navbar-nav">
<li>#Html.ActionLink("Home", "Index", "Home")</li>
<li>#Html.ActionLink("Shop by Category", "Index",
"Categories")</li>
<li>#Html.ActionLink("View All Our Products", "Index",
"Products")</li>
</ul>
#using (Html.BeginForm("Index", "Products", FormMethod.Get, new
#class = "navbar-form navbar-left"}))
{
<div class="form-group">
#Html.TextBox("Search",null,new {#class="form-
control",#placeholder="Search Products"})
</div>
<button type="submit" class="btn btn-default">Submit</button>
}
#Html.Partial("_LoginPartial")
</div>
</div>
</div>
<div class="container body-content">
#RenderBody()
<hr />
<footer>
<p>© #DateTime.Now.Year - My ASP.NET Application</p>
</footer>
</div>
#Scripts.Render("~/bundles/jquery")
#Scripts.Render("~/bundles/bootstrap")
#RenderSection("scripts", required: false)
the layout also is mentioned in _ViewStart.cshtml
#{
Layout = "~/Views/Shared/_Layout.cshtml";
}
but at the end what could be the reason that index page is looking like this, stripped away from menu, links, search box ...
i'm sure the link between "_layout page" and "views" is broken , but which factors beside #RenderBody( which already is there) are involved, I don't know.
btw. in the controller, I removed all viewbag and I'm using ViewModel , could it be a reason?

How to add a Date Picker on my View on a MVC project

I am learning .NET MVC, I am having a bit of difficult on adding a Date Picker on my Views.
What I am trying to do is that I want to create my Model called Person.cs:
public class Person
{
public int Id { get; set; }
[Required(ErrorMessage = "First name is required")]
public string FirstName { get; set; }
public string LastName { get; set; }
[DisplayFormat(ApplyFormatInEditMode = true, DataFormatString = "{0:dd/MM/yyyy}")]
public DateTime? DateOfBirth { get; set; }
}
_Layout.cshtml
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>#ViewBag.Title - My ASP.NET Application</title>
#using System.Web.Optimization
#Styles.Render("~/Content/css")
#Scripts.Render("~/bundles/modernizr")
</head>
<body>
<div class="navbar navbar-inverse navbar-fixed-top">
<div class="container">
<div class="navbar-header">
<button type="button" class="navbar-toggle" data-toggle="collapse" data-target=".navbar-collapse">
<span class="icon-bar"></span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
</button>
#Html.ActionLink("Application name", "Index", "Home", new { area = "" }, new { #class = "navbar-brand" })
</div>
<div class="navbar-collapse collapse">
<ul class="nav navbar-nav">
<li>#Html.ActionLink("List", "ListPerson", "Person")</li>
</ul>
</div>
</div>
</div>
<div class="container body-content">
#RenderBody()
<hr />
<footer>
<p>© #DateTime.Now.Year - My ASP.NET Application</p>
</footer>
</div>
#Scripts.Render("~/bundles/jquery")
#Scripts.Render("~/bundles/jqueryval")
#Scripts.Render("~/bundles/bootstrap")
#RenderSection("scripts", required: false)
</body>
</html>
BundleConfig.cs
using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.Optimization;
namespace WebApplication1.App_Start
{
public class BundleConfig
{
// For more information on bundling, visit http://go.microsoft.com/fwlink/?LinkId=301862
public static void RegisterBundles(BundleCollection bundles)
{
bundles.Add(new ScriptBundle("~/bundles/jquery").Include(
"~/Scripts/jquery-{version}.js"));
bundles.Add(new ScriptBundle("~/bundles/jqueryval").Include(
"~/Scripts/jquery.validate*"));
// Use the development version of Modernizr to develop with and learn from. Then, when you're
// ready for production, use the build tool at http://modernizr.com to pick only the tests you need.
bundles.Add(new ScriptBundle("~/bundles/modernizr").Include(
"~/Scripts/modernizr-*"));
bundles.Add(new ScriptBundle("~/bundles/bootstrap").Include(
"~/Scripts/bootstrap.js",
"~/Scripts/respond.js"));
bundles.Add(new StyleBundle("~/Content/css").Include(
"~/Content/bootstrap.css",
"~/Content/site.css"));
}
}
}
I am creating a View called Create.chstml, which it consist to create a new user.
#model WebApplication1.Models.Person
#{
ViewBag.Title = "Create";
}
<h2>Create</h2>
#using (Html.BeginForm())
{
#Html.AntiForgeryToken()
<div class="form-horizontal">
<h4>Person</h4>
<hr />
#Html.ValidationSummary(true, "", new { #class = "text-danger" })
<div class="form-group">
#Html.LabelFor(model => model.FirstName, htmlAttributes: new { #class = "control-label col-md-2" })
<div class="col-md-10">
#Html.EditorFor(model => model.FirstName, new { htmlAttributes = new { #class = "form-control" } })
#Html.ValidationMessageFor(model => model.FirstName, "", new { #class = "text-danger" })
</div>
</div>
<div class="form-group">
#Html.LabelFor(model => model.LastName, htmlAttributes: new { #class = "control-label col-md-2" })
<div class="col-md-10">
#Html.EditorFor(model => model.LastName, new { htmlAttributes = new { #class = "form-control" } })
#Html.ValidationMessageFor(model => model.LastName, "", new { #class = "text-danger" })
</div>
</div>
<div class="form-group">
#Html.LabelFor(model => model.DateOfBirth, htmlAttributes: new { #class = "control-label col-md-2" })
<div class="col-md-10">
#Html.EditorFor(model => model.DateOfBirth, new { htmlAttributes = new { #class = "datepicker form-control" } })
#Html.ValidationMessageFor(model => model.DateOfBirth, "", new { #class = "text-danger" })
</div>
</div>
<div class="form-group">
<div class="col-md-offset-2 col-md-10">
<input type="submit" value="Create" class="btn btn-default" />
</div>
</div>
</div>
}
<div>
#Html.ActionLink("Back to List", "ListPerson")
</div>
<link href="~/Content/themes/base/jquery-ui.min.css" rel="stylesheet" />
#section Scripts {
<script src="~/Scripts/jquery-ui-1.12.1.min.js"></script>
#Scripts.Render("~/bundles/jqueryval")
<script>
$(function() {
$(".datepicker").datepicker(
{
dateFormat: "yy/mm/dd",
changeMonth: true,
changeYear : true
});
});
</script>
}
Is there any simplest way to indicate on that it must popup a date-picker?
#Html.EditorFor(model => model.DateOfBirth, new { htmlAttributes = new { #class = "form-control datepicker" } })
I have installed on the packet-nugget the JQuery.UI.Combined
Making some research I found this link:
https://jqueryui.com/datepicker/
<script>
$( function() {
$( "#datepicker" ).datepicker();
} );
</script>
<p>Date: <input type="text" id="datepicker"></p>
Actually I don't know how to implement on my code.
I am trying to follow this link also:
https://forums.asp.net/t/2134739.aspx?How+to+add+datepicker+to+EditorFor+field+in+asp+net+mvc+5
Solution found from this video: https://www.youtube.com/watch?v=Yuo2XX5_rYo
The issue is probably your jQuery selector:
$("#datepicker").datepicker();
Currently this will find the HTML element with the id datepicker. Looking at your HTML snippet, it will generate the input with the id DateOfBirth instead (double check what it looks like when you inspect element). Try:
$("#DateOfBirth").datepicker();
The better alternative would be to add a class datepicker (or similar) to your HTML element, then use that as the selector so it applies to all datepickers that you may wish to use in the future:
View
#Html.EditorFor(model => model.DateOfBirth, new { htmlAttributes = new { #class = "form-control datepicker" } })
Javascript
$(".datepicker").datepicker();
I'd also look into how selectors work so you can better identify how to use them, for example if it's prefixed with # it will look for an element with that id attribute. If it's prefixed with . then it will look for all elements that have the class you specify.

Defined but have not been rendered for the layout page in MVC

I get this error:
The following sections have been defined but have not been rendered for the layout page "~/Views/Shared/_Layout.cshtml": "Scripts".
With the following code:
Create.cshtml
#model BabyStoreII.Models.Category
#{
ViewBag.Title = "Create";
}
<h2>Create</h2>
#using (Html.BeginForm())
{
#Html.AntiForgeryToken()
<div class="form-horizontal">
<h4>Category</h4>
<hr />
#Html.ValidationSummary(true, "", new { #class = "text-danger" })
<div class="form-group">
#Html.LabelFor(model => model.Name, htmlAttributes: new { #class = "control-label col-md-2" })
<div class="col-md-10">
#Html.EditorFor(model => model.Name, new { htmlAttributes = new { #class = "form-control" } })
#Html.ValidationMessageFor(model => model.Name, "", new { #class = "text-danger" })
</div>
</div>
<div class="form-group">
<div class="col-md-offset-2 col-md-10">
<input type="submit" value="Create" class="btn btn-default" />
</div>
</div>
</div>
}
<div>
#Html.ActionLink("Back to List", "Index")
</div>
#section Scripts {
#Scripts.Render("~/bundles/jqueryval")
}
_Layout.cshtml
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>Modern Business - #ViewBag.Title</title>
<!-- Bootstrap -->
<link href="#Url.Content("/css/bootstrap.css")" rel="stylesheet">
<link href="#Url.Content("/css/modern-business.css")" rel="stylesheet">
<!--[if lt IE 9]>
<script src="https://oss.maxcdn.com/libs/html5shiv/3.7.0/html5shiv.js"></script>
<script src="https://oss.maxcdn.com/libs/respond.js/1.4.2/respond.min.js"></script>
<![endif]-->
</head>
<body>
<div class="navbar navbar-inverse navbar-fixed-top">
<div class="container">
<div class="navbar-header">
<button type="button" class="navbar-toggle" data-toggle="collapse" data-target=".navbar-collapse">
<span class="icon-bar"></span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
</button>
#Html.ActionLink("Application name", "Index", "Home", new { area = "" }, new { #class = "navbar-brand" })
</div>
<div class="navbar-collapse collapse">
<ul class="nav navbar-nav">
<li>#Html.ActionLink("Home", "Index", "Home")</li>
<li>#Html.ActionLink("Shop by Category", "Index", "Categories")</li>
<li>#Html.ActionLink("View all our Products", "Index", "Products")</li>
</ul>
#using (Html.BeginForm("Index", "Products", FormMethod.Get, new { #class = "navbar-form navbar-left" }))
{
<div class="form-group">
#Html.TextBox("Search", null, new { #class = "form-control", #placeholder = "Search Products" })
</div>
<button type="submit" class="btn btn-default">Submit</button>
}
#Html.Partial("_LoginPartial")
</div>
</div>
</div>
<div class="container body-content">
#RenderBody()
<hr />
<footer>
<p>© #DateTime.Now.Year - My ASP.NET Application</p>
</footer>
</div>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script>
<script src="#Url.Content("/js/bootstrap.js")"></script>
<script src="#Url.Content("/js/modern-business.js")"></script>
</body>
</html>
And my client side validation does not work. It only works when I send the form to server but when I just lose focus an input box, the validation does not kick in. Below is my Model Validation:
Category.cs
using System.Collections.Generic;
using System.ComponentModel.DataAnnotations;
namespace BabyStoreII.Models
{
public class Category
{
public int ID { get; set; }
[Required(ErrorMessage = "The Category name cannot be blank.")]
[StringLength(50, MinimumLength = 3, ErrorMessage = "Please enter a category name between 3 and 50 characters in length.")]
[RegularExpression(#"^[A-Z]+[a-zA-Z''-'\s]*$", ErrorMessage = "Please enter a category beginning with a capital letter and made up of letters and spaces only.")]
[Display(Name="Category Name")]
public string Name { get; set; }
public virtual ICollection<Product> Products { get; set; }
}
}
Your help is greatly appreciated.
In you layout page you missing render script section.
So try
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>Modern Business - #ViewBag.Title</title>
<!-- Bootstrap -->
<link href="#Url.Content("/css/bootstrap.css")" rel="stylesheet">
<link href="#Url.Content("/css/modern-business.css")" rel="stylesheet">
<!--[if lt IE 9]>
<script src="https://oss.maxcdn.com/libs/html5shiv/3.7.0/html5shiv.js"></script>
<script src="https://oss.maxcdn.com/libs/respond.js/1.4.2/respond.min.js"></script>
<![endif]-->
</head>
<body>
<div class="navbar navbar-inverse navbar-fixed-top">
<div class="container">
<div class="navbar-header">
<button type="button" class="navbar-toggle" data-toggle="collapse" data-target=".navbar-collapse">
<span class="icon-bar"></span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
</button>
#Html.ActionLink("Application name", "Index", "Home", new { area = "" }, new { #class = "navbar-brand" })
</div>
<div class="navbar-collapse collapse">
<ul class="nav navbar-nav">
<li>#Html.ActionLink("Home", "Index", "Home")</li>
<li>#Html.ActionLink("Shop by Category", "Index", "Categories")</li>
<li>#Html.ActionLink("View all our Products", "Index", "Products")</li>
</ul>
#using (Html.BeginForm("Index", "Products", FormMethod.Get, new { #class = "navbar-form navbar-left" }))
{
<div class="form-group">
#Html.TextBox("Search", null, new { #class = "form-control", #placeholder = "Search Products" })
</div>
<button type="submit" class="btn btn-default">Submit</button>
}
#Html.Partial("_LoginPartial")
</div>
</div>
</div>
<div class="container body-content">
#RenderBody()
<hr />
<footer>
<p>© #DateTime.Now.Year - My ASP.NET Application</p>
</footer>
</div>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script>
<script src="#Url.Content("/js/bootstrap.js")"></script>
<script src="#Url.Content("/js/modern-business.js")"></script>
#RenderSection("scripts", false)
</body>
</html>
And If you are not using _ViewStart.cshtml then use
#{
Layout = Request.IsAjaxRequest() ? null : "~/Views/Shared/_Layout.cshtml";
ViewBag.Title = "Create";
}
In your create.cshtml page.
You need to call Layout on your page, Please change your Create.cshtml code :
#{
Layout = "~/Views/Shared/_Layout.cshtml";
ViewBag.Title = "Create";
}
Cheers !!
Replace your create.cshtml with below code
#model BabyStoreII.Models.Category
#{
ViewBag.Title = "Create";
Layout = Request.IsAjaxRequest() ? null : "~/Views/Shared/_Layout.cshtml";
}
<h2>Create</h2>
#using (Html.BeginForm())
{
#Html.AntiForgeryToken()
<div class="form-horizontal">
<h4>Category</h4>
<hr />
#Html.ValidationSummary(true, "", new { #class = "text-danger" })
<div class="form-group">
#Html.LabelFor(model => model.Name, htmlAttributes: new { #class = "control-label col-md-2" })
<div class="col-md-10">
#Html.EditorFor(model => model.Name, new { htmlAttributes = new { #class = "form-control" } })
#Html.ValidationMessageFor(model => model.Name, "", new { #class = "text-danger" })
</div>
</div>
<div class="form-group">
<div class="col-md-offset-2 col-md-10">
<input type="submit" value="Create" class="btn btn-default" />
</div>
</div>
</div>
}
<div>
#Html.ActionLink("Back to List", "Index")
</div>
#section Scripts {
#Scripts.Render("~/bundles/jqueryval")
}

Why I get space in the top of the view in _Layout.cshtml?

I use asp.net MVC 5 in my project.
Here the generated code in _Layout.cshtml page:
<body>
<div class="navbar navbar-inverse navbar-fixed-top">
<div class="container topNavBtn">
<div class="navbar-header ">
<button type="button" class="navbar-toggle" data-toggle="collapse" data-target=".navbar-collapse">
<span class="icon-bar"></span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
</button>
#Html.ActionLink("Application name", "Index", "Home", new { area = "" }, new { #class = "navbar-brand" })
</div>
<div class="navbar-collapse collapse">
<ul class="nav navbar-nav">
<li>#Html.ActionLink("Home", "Index", "Home", new { area = "" }, null)</li>
<li>#Html.ActionLink("API", "Index", "Help", new { area = "" }, null)</li>
</ul>
</div>
</div>
</div>
<div class="container body-content">
#RenderBody()
<hr />
<footer>
<p>© #DateTime.Now.Year - My ASP.NET Application</p>
</footer>
</div>
#Scripts.Render("~/bundles/jquery")
#Scripts.Render("~/bundles/bootstrap")
#RenderSection("scripts", required: false)
</body>
</html>
I remove code from this div:
<div class="navbar navbar-inverse navbar-fixed-top">
to create my own header:
<body>
<header style="background-color:green">My Header</header>
<div class="container body-content">
#RenderBody()
<hr />
<footer>
<p>© #DateTime.Now.Year - My ASP.NET Application</p>
</footer>
</div>
#Scripts.Render("~/bundles/jquery")
#Scripts.Render("~/bundles/bootstrap")
#RenderSection("scripts", required: false)
</body>
But in view I get space in top of the page:
Any ide why I get space above?
Using a fixed navbar in Bootstrap requires setting padding-top on the body to provide sufficient space for the navbar. That space at the top is where your navbar is supposed to go, but you haven't included it. If you don't want the navbar, simply remove the padding-top from the body element. Otherwise, add the navbar to fill the space.

The following sections have been defined but have not been rendered for the layout page "~/Views/Shared/SiteLayout.cshtml": "Scripts"

I have a simple view:
#model BootstrapTest4.Models.Account.CambioDeClave
#{
Layout = "~/Views/Shared/SiteLayout.cshtml";
}
<h2>#Model.Title</h2>
#using (Html.BeginForm()) {
#Html.AntiForgeryToken()
#Html.ValidationSummary(true)
<fieldset>
<div class="editor-label">
#Html.LabelFor(model => model.Pass1)
</div>
<div class="editor-field">
#Html.EditorFor(model => model.Pass1)
#Html.ValidationMessageFor(model => model.Pass1)
</div>
<div class="editor-label">
#Html.LabelFor(model => model.Pass2)
</div>
<div class="editor-field">
#Html.EditorFor(model => model.Pass2)
#Html.ValidationMessageFor(model => model.Pass2)
</div>
<p>
<input type="submit" value="Cambiar Clave" />
</p>
</fieldset>
}
#section Scripts {
#System.Web.Optimization.Scripts.Render("~/bundles/jqueryval")
}
this view was made via the Mvc4 scaffolding system (edit template) and since I use some dataannotations in my model it uses the Scripts Bundle.
the error I am getting is the following:
The following sections have been defined but have not been rendered for the layout page "~/Views/Shared/SiteLayout.cshtml": "Scripts"
searching I found that most people solve the problem adding this to their layout:
#if (IsSectionDefined("Scripts"))
{
RenderSection("Scripts",false);
}
I added that block just before the tag of my layout but i still get the same error.
as requested: my whole Layout:
#model BootstrapTest4.Models.IMenu
#using BootstrapTest4.Utils.Helpers
#using BootstrapTest4.Utils
#{
Layout = null;
}
<!DOCTYPE html>
#{
Model.usr = (UsuarioWebCliente)Session["DatosUsr"];
Model.usrDrogSelec = Html.DrogSeleccionada(Model.usr);
var Lista = Html.GeneraComboDrogs2(Model.usr, Model.usrDrogSelec.cod_drogueria);
}
<html>
<head>
<meta name="viewport" content="width=device-width" />
<title>#ViewBag.Title</title>
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<script src="~/Scripts/jquery-1.9.1.js"></script>
<script src="~/Scripts/bootstrap.js"></script>
<!-- Bootstrap -->
<link href="~/Content/bootstrap/bootstrap.css" rel="stylesheet" media="screen">
</head>
<body style="height: 100%; ">
<div class="wrapper">
<div>
<div id="whitebar">
<div class="container">
<div class="row">
<div class="col-md-6">
</div>
<div class="col-md-6" style="text-align: right">
#Model.usr.DatUsrs.desc_usuario - #Model.usr.DatUsrs.codigo_ident - #Html.ActionLink("Cerrar Sesion","Logout","Account")
</div>
</div>
</div>
</div>
<div id="bluebar">
<div class="container">
<div class="row">
<div class="col-md-4">
#Html.DropDownListFor(x => x.usr.DatUsrs.cod_drogueria, new SelectList(Lista, "Value", "Text"), new { #id = "DDLMENU", data_url = Url.Action("CambiarDrog", "Menu") })
</div>
<div class="col-md-3">
Monto Consumido:
<label id="SALDO">
#(Model.usrDrogSelec.saldo_actual == 0 ? "0.00" : Convert.ToDecimal(Model.usrDrogSelec.saldo_actual).ToString("#,##.00"))
</label>
</div>
<div class="col-md-3">
Hora Corte: XXXXX
</div>
<div class="col-md-2">
Día Corte:
<label id="DIA">
#Model.usrDrogSelec.dia_corte
</label>
</div>
</div>
</div>
</div>
<nav class="navbar navbar-default" role="navigation">
<!-- Brand and toggle get grouped for better mobile display -->
<div class="navbar-header">
<button type="button" class="navbar-toggle" data-toggle="collapse" data-target=".navbar-ex1-collapse">
<span class="sr-only">Toggle navigation</span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
</button>
<a class="navbar-brand" href="#">
<img style="max-height: 20px;" src="~/Content/Images/1381797224_home.png" />
</a>
</div>
<div class="collapse navbar-collapse navbar-ex1-collapse">
<ul class="nav navbar-nav">
#foreach (var item in Model.MenuCollection)
{
<li class="dropdown">
#item.Name <b class="caret"></b>
#if (item.Children.Count > 0)
{
<ul class="dropdown-menu">
#foreach (var childItem in item.Children)
{
<li>#Html.ActionLink(childItem.Name, childItem.Action, childItem.Controller)</li>
}
</ul>
}
</li>
}
</ul>
<ul class="nav navbar-nav navbar-right">
<li class="dropdown">
<span class="glyphicon glyphicon-cog"></span><b class="caret"></b>
<ul class="dropdown-menu">
<li>#Html.ActionLink("Droguería Principal","PrioridadDrogueria","ReportesPrioridadDrogueria")</li>
<li>Mensajería </li>
<li> #Html.ActionLink("Cambio de Clave", "CambiarClave", "Account")</li>
<li>Actualizar Datos</li>
</ul>
</li>
</ul>
</div>
<!-- /.navbar-collapse -->
</nav>
<div id="Content" style="height: 100%; ">
#RenderBody()
</div>
</div>
<div class="push"></div>
</div>
<div class="footer">
<div class="row">
<div class="col-md-12 footer">Test</div>
</div>
</div>
#if (IsSectionDefined("Scripts"))
{
RenderSection("Scripts",false);
}
</body>
</html>
Did you try only
RenderSection("Scripts",false);
Instead of
#if (IsSectionDefined("Scripts"))
{
RenderSection("Scripts",false);
}
You should just call RenderSection.
#RenderSection("Scripts", false)
I got the following error while running the application I resolved it by adding #RenderSection(“Scripts”,required:false) in the _Layout page.
#RenderSection("scripts", required: false)

Resources