我有两个Page One是主页面，第二个是使用jquery get方法弹出窗口中的PartialView页面和显示
我的主页
@model CT.SmartQueue.Entity.QueueModel
@{
ViewBag.Title = "AdminPanel";
Layout = "~/Views/Shared/_Layout.cshtml";
}
<h2>Queue Lists</h2>
<div class="col-lg-12">
<div class="ibox float-e-margins">
<div class="ibox-title">
<h5>For Service Centre Only: </h5>
<div class="ibox-tools">
</div>
</div>
<div class="ibox-content">
<table class="table table-striped">
<tr>
<th>
Code
</th>
<th>
Name
</th>
<th>
Description
</th>
<th>
IsActive
</th>
<th>
Edit
</th>
</tr>
@foreach (var item in Model.ClientQueueModel)
{
<tr>
<td>
@Html.DisplayFor(modelItem => item.Code)
</td>
<td>
@Html.DisplayFor(modelItem => item.Name)
</td>
<td>
@Html.DisplayFor(modelItem => item.Description)
</td>
<td>
<div class="switch">
<div class="onoffswitch">
@Html.CheckBoxFor(modelItem => item.IsActive, new { @class = "onoffswitch-checkbox", @id = item.Id, onclick = "changeQueueStatus(this.checked, this.id)" })
<label class="onoffswitch-label" for="@item.Id">
<span class="onoffswitch-inner"></span>
<span class="onoffswitch-switch"></span>
</label>
</div>
</div>
</td>
<td> <a href="javascript:void(0)" onclick="return fn_Load_Add('@Url.Action("AddQueue", "QueueSetup", new { id = @item.Id })')" class="btn btn-primary btn-xs ">Edit</a></td>
<td> <a href="javascript:void(0)" onclick="return fn_Load_AddDetail('@Url.Action("ClientQueueDetail", "QueueSetup", new { id = @item.Id })')" class="btn btn-primary btn-xs ">Edit QueueDetail</a></td>
</tr>
}
</table>
</div>
</div>
</div>
Popial for Partialview
<div class="modal fade in" id="id_Modal_Add" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
<div class="modal-dialog modal-content-custom ">
<div class="modal-content">
<div class="modal-header">
<button type="button" class="close" data-dismiss="modal">×</button>
<center> <h2 class="modal-title"><b>Client Queue </b> </h2></center>
</div>
<div class="modal-body" id="id_Modal_Add_Body" style="overflow: auto;">
...
</div>
</div>
</div>
主页脚本
@section Scripts {
@Scripts.Render("~/plugins/validate")
<script type="text/javascript">
function fn_Load_AddDetail(var_URL) {
debugger;
$("#id_Modal_Add_BodyDetail").html('');
$('#id_Modal_AddDetail').modal('show');
$.get(var_URL, function (response) {
debugger;
$("#id_Modal_Add_BodyDetail").html(response);
//$("#zz").removeData("validator");
//$("#zz").removeData("unobtrusiveValidation");
//$.validator.unobtrusive.parse("form");
//$.validator.unobtrusive.parse($("#zz"));
})
}
</script>
}
我的PrtialViewPage
@model CT.SmartQueue.Entity.QueueModel
@{
ViewBag.Title = "ClientQueueDetail";
//Layout = "~/Views/Shared/_Layout.cshtml";
}
<div class="row">
@using (Html.BeginForm("ClientQueueDetail", "QueueSetup", FormMethod.Post, new { @class = "form-horizontal" ,@id="zz"}))
{
@Html.ValidationSummary()
<div class="col-lg-8">
<div class="ibox float-e-margins">
<div class="ibox-title">
<h5>Queue Details:</h5>
<div class="ibox-tools">
@Html.HiddenFor(x => x.ClientQueueDetailModel.Id)
@Html.HiddenFor(x => x.ClientQueueDetailModel.ClientQueueId)
@Html.HiddenFor(x => x.QueueFieldSettingTemplateModel.Id)
@Html.HiddenFor(x => x.ClientQueueDetailModel.ClientId)
@Html.HiddenFor(x => x.QueueFieldSettingTemplateModel)
</div>
</div>
<script type="text/javascript">
function ValidateNumber(event) {
var theEvent = event || window.event;
var key = theEvent.keyCode || theEvent.which;
key = String.fromCharCode(key);
var regex = /[0-9]|\./;
if (!regex.test(key)) {
theEvent.returnValue = false;
if (theEvent.preventDefault) theEvent.preventDefault();
}
}
</script>
<div class="ibox-content">
<div class="form-group">
<label class="col-lg-6 control-label">Total number of queue for day</label>
<div class="col-lg-3">
@Html.TextBoxFor(model => model.ClientQueueDetailModel.MaxQueueCountForTheDay, new { @class = "form-control input-sm", @onkeypress = "ValidateNumber(event);" })
</div>
</div>
<div class="form-group">
<label class="col-lg-6 control-label">Average time take/queue</label>
<div class="col-lg-3">
@Html.TextBoxFor(model => model.ClientQueueDetailModel.AverageTimeTakenPerQueue, new { @class = "form-control input-sm", @onkeypress = "ValidateNumber(event);" })
</div>
</div>
<div class="form-group">
<label class="col-lg-6 control-label">Notification Type</label>
<div class="col-lg-3">
@Html.DropDownListFor(model => model.ClientQueueDetailModel.NotificationType, new List<SelectListItem>() { new SelectListItem { Text = "Minutes Before", Value = "5" }, new SelectListItem { Text = "In Queue", Value = "6" } }, new { @class = "form-control", @placeholder = "Select Status Type", @required = "" })
</div>
</div>
<div class="form-group">
<label class="col-lg-6 control-label">Notification to user in advance</label>
<div class="col-lg-3">
@Html.TextBoxFor(model => model.ClientQueueDetailModel.NotificationToUserinAdvance, new { @class = "form-control input-sm", @onkeypress = "ValidateNumber(event);" })
</div>
</div>
@*@if (Model.QueueFieldSettingTemplateModel.IsEmergencyQueueVisible == true)
{*@
<div class="form-group">
<label class="col-lg-6 control-label">Emergency queue</label>
<div class="col-lg-3">
<div class="switch">
<div class="onoffswitch">
@Html.CheckBoxFor(model => model.ClientQueueDetailModel.IsEmergencyQueueOn, new { @class = "onoffswitch-checkbox", @checked = Model.ClientQueueDetailModel.IsEmergencyQueueOn, @id = "editIsEmergencyQueueOn" })
<label class="onoffswitch-label" for="editIsEmergencyQueueOn">
<span class="onoffswitch-inner"></span>
<span class="onoffswitch-switch"></span>
</label>
</div>
</div>
</div>
</div>
@*}*@
</div>
</div>
</div>
<div class="col-lg-4">
<div class="ibox float-e-margins">
<div class="ibox-title">
<h5>Queue Preferences: </h5>
<div class="ibox-tools">
</div>
</div>
<div class="ibox-content">
@*@if (Model.QueueFieldSettingTemplateModel.IsNameVisible == true)
{*@
<div class="setings-item">
<span>
Name
</span>
<div class="switch">
<div class="onoffswitch">
@Html.CheckBoxFor(model => model.ClientQueueDetailModel.IsNameRequired, new { @checked = Model.ClientQueueDetailModel.IsNameRequired, @class = "onoffswitch-checkbox", @id = "editIsNameRequired" })
<label class="onoffswitch-label" for="editIsNameRequired">
<span class="onoffswitch-inner"></span>
<span class="onoffswitch-switch"></span>
</label>
</div>
</div>
</div>
@*}
@if (Model.QueueFieldSettingTemplateModel.IsNRICVisible == true)
{*@
<div class="setings-item">
<span>
NRIC
</span>
<div class="switch">
<div class="onoffswitch">
@Html.CheckBoxFor(model => model.ClientQueueDetailModel.IsNRICRequired, new { @checked = Model.ClientQueueDetailModel.IsNRICRequired, @class = "onoffswitch-checkbox", @id = "editIsNRICRequired" })
<label class="onoffswitch-label" for="editIsNRICRequired">
<span class="onoffswitch-inner"></span>
<span class="onoffswitch-switch"></span>
</label>
</div>
</div>
</div>
@*}
@if (Model.QueueFieldSettingTemplateModel.IsPhoneNumberVisible == true)
{*@
<div class="setings-item">
<span>
Phone Number
</span>
<div class="switch">
<div class="onoffswitch">
@Html.CheckBoxFor(model => model.ClientQueueDetailModel.IsPhoneNumberRequired, new { @class = "onoffswitch-checkbox", @id = "editIsPhoneNumberRequired" })
<label class="onoffswitch-label" for="editIsPhoneNumberRequired">
<span class="onoffswitch-inner"></span>
<span class="onoffswitch-switch"></span>
</label>
</div>
</div>
</div>
<div class="setings-item">
<span>
Date of Birth
</span>
<div class="switch">
<div class="onoffswitch">
@Html.CheckBoxFor(model => model.ClientQueueDetailModel.IsDOBRequired, new { @class = "onoffswitch-checkbox", @id = "editIsDOBRequired" })
<label class="onoffswitch-label" for="editIsDOBRequired">
<span class="onoffswitch-inner"></span>
<span class="onoffswitch-switch"></span>
</label>
</div>
</div>
</div>
@*}
@if (Model.QueueFieldSettingTemplateModel.IsAddressVisible == true)
{*@
<div class="setings-item">
<span>
Address
</span>
<div class="switch">
<div class="onoffswitch">
<input type="checkbox" name="collapsemenu" class="onoffswitch-checkbox" id="example4">
@Html.CheckBoxFor(model => model.ClientQueueDetailModel.IsAddressRequired, new { @class = "onoffswitch-checkbox", @id = "editIsAddressRequired" })
<label class="onoffswitch-label" for="editIsAddressRequired">
<span class="onoffswitch-inner"></span>
<span class="onoffswitch-switch"></span>
</label>
</div>
</div>
</div>
@*}
@if (Model.QueueFieldSettingTemplateModel.IsNoOfPaxVisible == true)
{*@
<div class="setings-item">
<span>
No. of Pax
</span>
<div class="switch">
<div class="onoffswitch">
<input type="checkbox" name="collapsemenu" class="onoffswitch-checkbox" id="example5">
@Html.CheckBoxFor(model => model.ClientQueueDetailModel.IsNoOfPaxRequired, new { @class = "onoffswitch-checkbox", @id = "editIsNoOfPaxRequired" })
<label class="onoffswitch-label" for="editIsNoOfPaxRequired">
<span class="onoffswitch-inner"></span>
<span class="onoffswitch-switch"></span>
</label>
</div>
</div>
</div>
<div class="setings-item">
<span>
Gender
</span>
<div class="switch">
<div class="onoffswitch">
@Html.CheckBoxFor(model => model.ClientQueueDetailModel.IsGenderRequired, new { @class = "onoffswitch-checkbox", @id = "editIsGenderRequired" })
<label class="onoffswitch-label" for="editIsGenderRequired">
<span class="onoffswitch-inner"></span>
<span class="onoffswitch-switch"></span>
</label>
</div>
</div>
</div>
@*}*@
<div class="form-group">
<label class="col-md-6"></label>
@*<div class="col-lg-3">
<button type="submit" class="btn btn-primary pull-right">Cancle</button>
</div>*@
</div>
</div>
</div>
</div>
<div class="col-md-12">
<div class="pull-right">
@*<a class="btn btn-danger" href="#">Cancel</a>*@
<button type="submit" class="btn btn-primary" onclick="return Validation();">Save</button>
<button type="button" class="btn btn-default" data-dismiss="modal" id="normalClose">Close</button>
</div>
</div>
}
</div>
@section Scripts {
@Scripts.Render("~/plugins/validate")
<script type="text/javascript">
$.validator.unobtrusive.parse($("#zz"));
$("#zz").validate({
rules: {
'ClientQueueDetailModel.MaxQueueCountForTheDay': {
required: true,
},
'ClientQueueDetailModel.AverageTimeTakenPerQueue': {
required: true
},
'ClientQueueDetailModel.NotificationToUserinAdvance': {
required: true,
//number: true
}
}
});
</script>
}
我在主页面的poup中显示部分视图页面使用jquery $ get调用但是jquery验证没有激活，同样的事情不起作用，可能其他的部分视图页面我知道这个问题中的很多文章但是没有为我工作 任何想法然后PLZ帮助我 谢谢
答案 0 :(得分：3)
使用Ajax加载部分View时，您需要更改DOM。
不显眼的验证在页面加载时解析DOM并添加一些事件列表器。
事情是，当您更改DOM不显眼的验证时，只是不知道新添加的元素。这就是为什么你应该在你的ajax调用后取消注释（和modidy选择器）行。
或者我建议你放在那里：
$("#id_Modal_Add_BodyDetail").html(response);
$('#id_Modal_Add_BodyDetail form').data('validator', null);
$.validator.unobtrusive.parse('#id_Modal_Add_BodyDetail form');