2016-06-20 16 views
0

Ich verfüge über 2 Felder mit Kontrollkästchen: Wenn in Panel1 alle Kontrollkästchen aktiviert sind, muss Panel2 angezeigt werden. Ich habe ein HTML und ein Skript, aber es funktioniert nicht, ich denke, dass ich etwas vermisse. hier ist mein Code:Überprüfen, ob alle Kontrollkästchen in Panel1 aktiviert sind, um ein Panel2 anzuzeigen.

<body> 
<asp:Panel ID="Panel1" runat="server"> 
    <table> 
     <tr> 
      <td> 
       <asp:Label ID="Title" runat="server" Text="Enter the Title"></asp:Label> 
      </td> 
      <td> 
       <asp:TextBox ID="TextBox1" runat="server"></asp:TextBox> 
      </td> 
     </tr> 
     <tr> 
      <td> 
       <asp:Label ID="Question1" runat="server" Text="Question1"></asp:Label> 
      </td> 
      <td> 
       <asp:CheckBox ID="CheckBox1" name="cb" runat="server" Checked="false" /> 
      </td> 
     </tr> 
     <tr> 
      <td> 
       <asp:Label ID="Question2" runat="server" Text="Question2"></asp:Label> 
      </td> 
      <td> 
       <asp:CheckBox ID="CheckBox2" name="cb" runat="server" Checked="false" /> 
      </td> 
     </tr> 
     <tr> 
      <td> 
       <asp:Label ID="Question3" runat="server" Text="Question3"></asp:Label> 
      </td> 
      <td> 
       <asp:CheckBox ID="CheckBox3" name="cb" runat="server" Checked="false" /> 
      </td> 
     </tr> 
    </table> 
</asp:Panel> 
<asp:Panel ID="Panel2" runat="server"> 
    <table> 
     <tr> 
      <td> 
       <asp:Label ID="Question4" runat="server" Text="Question4"></asp:Label> 
      </td> 
      <td> 
       <asp:CheckBox ID="CheckBox4" runat="server" Checked="false" /> 
      </td> 
     </tr> 
    </table> 
</asp:Panel> 
<table> 
    <tr> 
     <td> 
      <asp:Button ID="Button1" runat="server" Text="Submit" OnClick="Button1_Click" /> 
     </td> 
    </tr> 
</table> 

Und das ist mein Skript, aber es ist nicht

$(document).ready(function() { 
$('#CheckBox1').removeAttr('checked'); 
$('#CheckBox2').removeAttr('checked'); 
$('#CheckBox3').removeAttr('checked'); 
$('#CheckBox4').removeAttr('checked'); 
$('#Panel2').hide(); 
$('#Panel1').change(function() { 
if (this.checked) { 
$('#Panel2').show(); 
} 
else { 
$('#Panel2').hide(); 
} 
}); 
}); 

Hilfe bitte

+0

Ich habe dieses Skript auch gefunden, aber welches ist besser und warum hat es nicht funktioniert: '$ (document) .ready (function() { var a = document.getElementsByName (" cb "); für (var i = 0; i BKChedlia

Antwort

0

jQuery arbeiten Verwenden Sie die markierten Kontrollkästchen vs alle Kontrollkästchen vergleichen Inside Panel1 wie folgt:

if($("#Panel1 input[type=checkbox]:checked").length === $("#Panel1 input[type=checkbox]").length){ 
    $('#Panel2').show(); 
}else{ 
    $('#Panel2').hide(); 
}