Я хочу вызвать функцию jquery на кнопку Modal popup submit, которая находится в частичном представлении, но функция не вызывается, если эта кнопка находится в частичном представлении, она вызывается только тогда, когда я помещаю свой модальный всплывающий вид в основном представлении. Как решить эту проблему... Пожалуйста, помогите.. Спасибо
Index.cshtml
@Html.ActionLink("Create", "Create", null, null, new { id = "btnCreate", @class = "btn btn-small btn-info" })
<script type="text/javascript">
$(function () {
$.ajaxSetup({ cache: false });
$('#btnCreate').click(function () {
alert("function called");
$('.modal-dialog').load(this.href, function () {
$('#ShowModalDialog').modal({
backdrop: 'static',
keyboard: true
}, 'show');
});
return false;
});
});
</script>
</head>
<body>
<script type="text/javascript">
$(document).ready(function () {
$('#Useremail').blur(function () {
alert("func called");
$.ajax({
type: 'POST',
contentType: "application/json; charset=utf-8",
url: 'Home/Search',
data: "{'searchString':'" + document.getElementById('Useremail').value + "'}",
async: false,
success: function (response) {
alert("Record found");
},
error: function () { alert("record not found"); }
});
});
});
</script>
<div id='ShowModalDialog' class='modal fade in'>
<div class='modal-dialog'>
</div>
</div>
</body>
</html>
_Create.cshtml PartialView
@model MvcTwitterBootstrap.Models.UserDetail
<div class="modal-content">
<div class="modal-header">
<button type="button" class="close" data-dismiss="modal" aria-hidden="true">
×</button>
<h3 id="myModalLabel">
Registration</h3>
</div>
@using (Html.BeginForm("Create", "Home", FormMethod.Post, new { @class = "modal-form" }))
{
@Html.ValidationSummary()
<div class="modal-body">
<div>
@Html.LabelFor(x => x.UserEmail)
@Html.TextBoxFor(x => x.UserEmail, new { @id = "Useremail" })
@Html.ValidationMessageFor(x => x.UserEmail)
</div>
<div>
@Html.LabelFor(x => x.UserPassword)
@Html.TextBoxFor(x => x.UserPassword, new { id = "Userpassword" })
@Html.ValidationMessageFor(x => x.UserPassword)
</div>
</div>
<div class="modal-footer">
<button class="btn" data-dismiss="modal" aria-hidden="true">
Cancel</button>
<button class="btn btn-primary" type="button" id="btnsubmit">
Save</button>
</div>
}
</div>
для элементов, которые добавляются в форму после загрузки, вам нужно поместить функцию в документ вместо элемента
$(document).on('click', '#btnCreate', function(){
//code
});
другим вариантом было бы поместить все события щелчка в функцию
function LoadScript(){
//jquery code here
}
и затем вызвать эту функцию после частичной загрузки
$('#divContent').html(result);
LoadScript();