2015-09-08 116 views
0

我在UpdatePanel内有3个弹出窗口。第一个弹出窗口包含RadioButtonList,选择在第二个弹出窗口中生成RadioButtonList。从第二个弹出窗口选择单选按钮时,填充CheckBoxList“chkListSafetyStandards”。点击第三个弹出窗口的关闭按钮时,我希望获得选中的复选框的文本和值。无法获取更新面板中使用JavaScript/JQuery检查的ASPX Checkboxlist的值

的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,因为这会导致整个页面重新加载第一个选项卡(我在第二个选项卡中使用此复选框)。请提出可能的解决方案。

+0

如果你看到的复选框,则意味着该标记是在页面上。你可以告诉我们你正在使用的js代码试图访问这个标记,也许问题隐藏在那里? – Andrei

回答

0

〔实施例的你怎么能得到遏制值:

<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> 
+0

问题不在于我无法获取选中的复选框。但是,当复选框列表位于更新面板内时,“checked”属性不会被反映出来。除了将逻辑推入代码隐藏页面之外,我没有找到任何解决方案。非常感谢Hanks。 :-) –

相关问题