Advanced Search

JQuery: Select All / Clear / Cascade

/ Published in: jQuery
Save to your folder(s)
This code can be used to create a MVC View User Control (.ascx) that will display a cascade or select all button with a clear button for checkboxes arranged in a hierarchy.

Expand | Embed | Plain Text

Copy this code and paste it in your HTML 
  1. <%@ Control Language="VB" Inherits="System.Web.Mvc.ViewUserControl" %>
  2.  
  3. <% 
  4.     Dim Args() As String = ViewData("Args").ToString.Split(",")
  5.     Dim SelectType As String = Args(0)
  6.     Dim Label As String = Args(1)
  7.  
  8.     If SelectType = "Cascade" Then
  9. %>
  10.         <input type="button" id="cascade" class="StandardButton" value="Cascade" />&nbsp;
  11. <%  Else%>
  12.         <input type="button" id="selectall" class="StandardButton" value="Select All" /><br />
  13. <%  End If%>
  14. <input type="button" id="clear" class="StandardButton" value='<%= Label %>' />
  15.  
  16. <script type="text/javascript" language="javascript">
  17.     $(document).ready(function() {
  18.         $('#selectall').click(function() {
  19.             $("input[type='checkbox']:not([disabled='disabled'])").attr('checked', true);
  20.         });
  21.         $('#clear').click(function() {
  22.             $("input[type='checkbox']:not([disabled='disabled'])").attr('checked', false);
  23.         });
  24.         $('#cascade').click(function() {
  25.             $("div input[type='checkbox']").each(function() {
  26.                 if ($(this).attr('checked') == true) {
  27.                     $(this).siblings('div:eq(0)').find(':checkbox').attr('checked', true);
  28.                 }
  29.             });
  30.         }); 
  31.     });
  32. </script>

Report this snippet


Comments

RSS Icon Subscribe to comments

You need to login to post a comment.