无法获取使用 JavaScript / JQuery 检查的更新面板内的 ASPX Checkboxlist 的值

Question

UpdatePanel 中有 3 个弹出窗口。第一个弹出窗口包含RadioButtonList 选择，它在第二个弹出窗口中生成RadioButtonList。在从 2nd 中选择单选按钮后，将填充 CheckBoxList“chkListSafetyStandards”。单击第三个弹出窗口的关闭按钮时，我希望获取选中的复选框的文本和值。

ASPX 标记如下：

 <!--MODAL POP FOR SELECTING OBS ACTION TAKEN [END]-->
<asp:UpdatePanel ID="updtPnlPopUpsObsCatAndSubCat" runat="server">
    <ContentTemplate>
        <!--MODAL POP FOR SELECTING OBS CATEGORY [START]-->
        <asp:LinkButton ID="lnkBtnObservationCategory" PostBackUrl="#" CssClass="btn btn-large btn-primary"
            Style="display: none;" data-toggle="modal" data-backdrop="static" data-keyboard="false"
            data-target="#modalSelectObsCat" runat="server"></asp:LinkButton>
        <div class="modal fade" id="modalSelectObsCat">
            <div class="modal-dialog modal-dialog-center">
                <div class="modal-content">
                    <div class="modal-header bg-blue">
                        <div class="bootstrap-dialog-header">
                            <button type="button" class="close" data-dismiss="modal" aria-label="Close">
                                <span aria-hidden="true">&nbsp;&times;&nbsp;</span></button>
                            <div class="bootstrap-dialog-title">
                                <label>
                                    Select Observation Category
                                </label>
                            </div>
                        </div>
                    </div>
                    <div class="modal-body">
                        <div class="bootstrap-dialog-body">
                            <div class="bootstrap-dialog-message">
                                <div class="row modalBodyHeightForVisitedWith">
                                    <div class="col-md-12 col-xs-12">
                                        <asp:RadioButtonList ID="rdbListObservationCategory" onclick="getObsCategory();showLoader();closeModal();return true;"
                                            CssClass="radio-list-custom" OnSelectedIndexChanged="rdbListObservationCategory_SelectedIndexChanged"
                                            AutoPostBack="true" RepeatLayout="Flow" RepeatDirection="Vertical" runat="server">
                                        </asp:RadioButtonList>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                    <!-- /.modal-content -->
                </div>
                <!-- /.modal-dialog -->
            </div>
        </div>
        <!-- /.modal -->
        <!--MODAL POP FOR SELECTING OBS CATEGORY [END]-->
        <!--MODAL POP FOR SELECTING OBS SUB CATEGORY [START]-->
        <asp:LinkButton ID="lnkBtnObservationSubCategory" PostBackUrl="#" CssClass="btn btn-large btn-primary"
            Style="display: none;" data-toggle="modal" data-backdrop="static" data-keyboard="false"
            data-target="#modalSelectObsSubCat" runat="server"></asp:LinkButton>
        <%--  <a id="lnkBtnObservationSubCategory" href="#" class="btn btn-large btn-primary" style="display: none;"
            data-toggle="modal" data-backdrop="static" data-keyboard="false" data-target="#modalSelectObsSubCat" />--%>
        <div class="modal fade" id="modalSelectObsSubCat">
            <div class="modal-dialog modal-dialog-center">
                <div class="modal-content">
                    <div class="modal-header bg-blue">
                        <div class="bootstrap-dialog-header">
                            <button type="button" class="close" data-dismiss="modal" aria-label="Close">
                                <span aria-hidden="true">&nbsp;&times;&nbsp;</span></button>
                            <div class="bootstrap-dialog-title">
                                <label>
                                    Select Observation Sub Category
                                </label>
                            </div>
                        </div>
                    </div>
                    <div class="modal-body">
                        <div class="bootstrap-dialog-body">
                            <div class="bootstrap-dialog-message">
                                <div class="row modalBodyHeightForVisitedWith">
                                    <div class="col-md-12 col-xs-12">
                                        <asp:RadioButtonList ID="rdbListObservationSubCategory" onclick="getObsSubCategory();closeModal();"
                                            CssClass="radio-list-custom" OnSelectedIndexChanged="rdbListObservationSubCategory_SelectedIndexChanged"
                                            AutoPostBack="true" RepeatLayout="Flow" RepeatDirection="Vertical" runat="server">
                                        </asp:RadioButtonList>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                    <!-- /.modal-content -->
                </div>
                <!-- /.modal-dialog -->
            </div>
        </div>
        <!-- /.modal -->
        <!--MODAL POP FOR SELECTING OBS SUB CATEGORY [END]-->
        <!--MODAL POP FOR SELECTING OBS SAFETY STANDARDS [START]-->
        <asp:LinkButton ID="lnkBtnSafetyStandards" PostBackUrl="#" CssClass="btn btn-large btn-primary"
            Style="display: none;" data-toggle="modal" data-backdrop="static" data-keyboard="false"
            data-target="#modalSelectSafetyStandards" runat="server"></asp:LinkButton>
        <%--  <a id="lnkBtnObservationSubCategory" href="#" class="btn btn-large btn-primary" style="display: none;"
            data-toggle="modal" data-backdrop="static" data-keyboard="false" data-target="#modalSelectObsSubCat" />--%>
        <div class="modal fade" id="modalSelectSafetyStandards">
            <div class="modal-dialog">
                <div class="modal-content">
                    <div class="modal-header bg-blue">
                        <div class="bootstrap-dialog-header">
                            <button type="button" class="close" data-dismiss="modal" onclick="getObsSafetyStandards();closeModal();"
                                aria-label="Close">
                                <span aria-hidden="true">&nbsp;&times;&nbsp;</span></button>
                            <div class="bootstrap-dialog-title">
                                <label>
                                    Select Safety Standards
                                </label>
                            </div>
                        </div>
                    </div>
                    <div class="modal-body">
                        <div class="bootstrap-dialog-body">
                            <div class="bootstrap-dialog-message">
                                <div class="row modalBodyHeightForVisitedWith">
                                    <div class="col-md-12 col-xs-12">
                                        <asp:CheckBoxList ID="chkListSafetyStandards" CssClass="chk-list-custom" runat="server">
                                        </asp:CheckBoxList>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                    <!-- /.modal-content -->
                </div>
                <!-- /.modal-dialog -->
            </div>
        </div>
        <!-- /.modal -->
        <!--MODAL POP FOR SELECTING OBS SAFETY STANDARDS [END]-->
    </ContentTemplate>
</asp:UpdatePanel>

选中复选框后，[checked="checked"] 标记不会反映在页面上，因此我无法使用 JavaScript 捕获选中的复选框。我无法删除UpdatePanel，因为这会导致整个页面重新加载加载第一个选项卡（我在第二个选项卡中使用此复选框）。请提出一个可能的解决方案。

Answer 1

如何获取检查值的示例：

    <asp:CheckBoxList ID="chkListSafetyStandards" CssClass="chk-list-custom" runat="server">
        <asp:ListItem Text="option 1"></asp:ListItem>
        <asp:ListItem Text="option 2" Selected="True"></asp:ListItem>
        <asp:ListItem Text="option 3"></asp:ListItem>
    </asp:CheckBoxList>

    <script>
        function getChecked() {
            var checked = $('input[id*="chkListSafetyStandards"]:checked');
            checked.each(function (index, value) {
                console.log($(value).attr("id"));
            });
        }
    </script>