I'm developing modal windows for my create and edit function in MVC:
The creation of the button (create and edit) I do it from the index.cshtml in the following way:
<a id="btnCreateBodega" data-toggle="modal" class="btn btn-success" href="#myModalBodega"> Create Winery </a>
<a href="#myModalBodega" id="btnEditBodega" class="btn btn-success" data-toggle="modal" data-id="@item.Kn_Codigo"> Edit </a>
Then I create my Modal Window and configure my scripts:
<Div id = "myModalBodega" class = "modal fade" tabindex = "- 1" role = "dialog" aria-labelledby = "myLargeModalLabel">
<Div class = "modal-dialog">
<Div class = "modal-content">
<Div class = "modal-body">
<Div id = "modal-content">
</ Div>
</ Div>
</ Div>
</ Div>
</ Div>
@section Scripts
{
<Script>
$ ('# BtnCreateBodega'). Click (function (eve) {
$ ("# Modal-content"). Load ("/ Bodegas / Create");
})
$ ('# BtnEditBodega'). Click (function (eve) {
$ ("# Modal-content"). Load ("/ Bodegas / Edit /" + $ (this) .data ("id"));
})
</ Script>
}
But when running my modal window, this brings the Menu Layout .... Solve this problem by putting in the create and edit view
@{
ViewBag.Title = "Create";
Layout = null;
}
Looks like you are returning a full view which includes the layout as well ,for the modal content. You should return a partial view result
So in the Create
action method, return partial view if the request is ajax request.
if(Request.IsAjaxReques())
{
return PartialView();
}
return View(); // if your action method supports non ajax calls, return normal view.
When you call PartialView
method, it will not include the code from your layout file when rendering the view.
This does the same thing as your fix, which is setting the layout to null.
Now to fix your date picker, you need to include the javascript files needed for datepicker in your main page/ main page's layout. So when you page is loaded, it loads the needed scripts to enable the datepicker behavior.