复选框更改事件在部分视图 mvc 中不起作用

Question

I have one partial view page having 3 radio buttons namely All Employees,Designation & Confirmation Date.By default first is selected.on click of third radio button i need to enter date in textbox after that ajax call is made and data filtered by date is renderd in div tag.
///the following is code for that partial view

@model HRMS.Models.EligibilityCriteriaModel
<script src="@Url.Content("~/Scripts/jquery.validate.unobtrusive.min.js")" type="text/javascript"></script>
<script src="@Url.Content("../../Scripts/jquery.unobtrusive-ajax.min.js")" type="text/javascript"></script>
@{
    ViewBag.Title = "Index";    
}
@Html.HiddenFor(modelItem => modelItem.allConfirmationDateEmployeeListCount, new { id = "ConfirmationDateEmpListCount" })
@if (Model.allConfirmationDateEmployeeList != null)
{
<table cellpadding="0" cellspacing="0" border="0" width="100%" id="tbl_allEmployees"
    class="TablesBlueHeaders">
    <thead>
        <tr>
            <th width="10%" class="bluebgtable1">
                Employee Code
            </th>
            <th class="bluebgtable1" width="15%">
                Employee Name
            </th>
            <th class="bluebgtable1" width="15%">
                Delivery Team
            </th>
            <th class="bluebgtable1" width="15%">
                Designation
            </th>
            <th class="bluebgtable1" width="15%">
                Confirmation Date
            </th>
            <th class="bluebgtable1" width="15%">
                Select
            </th>
        </tr>
    </thead>
    <div class="abc" id="SampleID">
        @foreach (var item in Model.allConfirmationDateEmployeeList)
        {
        <tr id="@item.EmployeeID" class="highlightRed">
            <td align="center">
                @Html.DisplayFor(modelItem => item.EmployeeCode, new { @readonly = "readonly" })
            </td>
            <td>
                @Html.DisplayFor(modelItem => item.EmployeeName, new { @readonly = "readonly" })
            </td>
            <td>
                @Html.DisplayFor(modelItem => item.DeliveryTeam, new { @readonly = "readonly" })
            </td>
            <td>
                @Html.DisplayFor(modelItem => item.Designation, new { @readonly = "readonly" })
            </td>
            <td>
                @Html.DisplayFor(modelItem => item.ConfirmationDate, new { @readonly = "readonly" })
            </td>
            <td align="center">
                @Html.CheckBoxFor(modelItem => item.Checked, new { @class = "chkAllConfDateEmployees", @id = item.EmployeeID, @for = item.AppraisalYearID })
            </td>
        </tr>
        }
    </div>
</table>
}

现在这个视图将在 div 中呈现。 现在在我的孩子部分视图中，我无法获得复选框的更改事件。我想依靠更改事件。

图像显示了具有文本框和搜索按钮的局部视图页面。单击按钮时，我需要在搜索按钮下方的 div 标记中呈现其他局部视图。此视图将具有复选框，并且我的复选框更改事件不起作用在那边。 希望你能明白我想说什么。！[在此处输入图片描述][1]

Answer 1

如果您正在执行部分视图，并使用 JQuery 选择器监视更改事件，您可能会遇到两个陷阱之一（注意：如果您不使用 JQuery，这无关紧要）

1. 如果 JQuery 脚本位于 DOM 中的元素之上，它将不会在其上执行。要解决这个问题，您应该将所有 JQuery 选择器（例如 $('input').on('change'...) 放在 document.ready 事件中。（$(document).ready(function() { ... your jquery here ...});
2. 如果您的部分视图是通过 AJAX 呈现的，您将需要在其中重新实例化任何 JQuery 选择器。它们在文档就绪事件之后加载

如果这有帮助，请告诉我。