Get checkboxlist in javascript and check the status of the checkboxes RSS

• • Reply
  

  linch12

  Member

  87 Points

  40 Posts

  Get checkboxlist in javascript and check the status of the checkboxes

  Apr 25, 2006 09:40 PM|LINK

  I used the following code to get the checkboxlist control in javascript

  var j=0;var chk=document.getElementById('" & checklist.ClientID & "');

  alert(chk);

  The message shows [Object] which means it is valid. Then I used the following code trying to loop through the control and get the status

  for(i=0;i<chk.length;i++){

  var chklist=document.getElementById(chk + '_' + i );

  alert(chklist);

  if(chklist.checked){

      j=j+1;

  "}"

  The alert message shows [Undefined]. did same thing on chk.length, shows [undefined] as well.

  Read on help document from MS, checklistbox renders a input control for the checkbox and a label control for the description. But I can't find anything related to the checkboxlist in the source code at all after the page is rendered.

  Anyone can help?

• • Reply
  

  orzeh

  Contributor

  4993 Points

  897 Posts

  Re: Get checkboxlist in javascript and check the status of the checkboxes

  Apr 26, 2006 06:52 AM|LINK

  hi!
  
  checkboxlist is rendering to separate <input> tags so You can`t access it as an array.
  here is some example how to do what you want from code behind:
  
  
  
  
   

  StringBuilder sb = new StringBuilder();
  
          sb.AppendLine( "j = 0;" );
          sb.Append( "for( i = 0; i < " );
          sb.Append( CheckBoxList1.Items.Count );
          sb.AppendLine( "; i++ ){" );
          sb.Append( "var chlist = document.getElementById( '" );
          sb.Append( CheckBoxList1.ClientID );
          sb.Append( "_' + i );" );
          sb.AppendLine( "alert( chlist.checked );" );
          sb.AppendLine( "if( chlist.checked ) j++;" );
          sb.AppendLine( "}" );
  
          ClientScript.RegisterStartupScript( this.GetType(), "script", sb.ToString(), true );

   
  orzeh
  
  
  code less, think more!
• • Reply
  

  Dyno1979b

  Participant

  1764 Points

  347 Posts

  Re: Get checkboxlist in javascript and check the status of the checkboxes

  Apr 26, 2006 11:57 AM|LINK

  You kinda missed it a little but you can treat it as an object:
  
  var chk=document.getElementById( form);   // form is the form name in your page
  var checkboxlist = chk.CheckBoxListName;
  
  if( checkboxlist.length == undefined )     
  {
          // in this case you have a single element on page - not an array
         if( checkboxlist.checked )
         {
               // do something
         }
  }
  else
  {
      // we do have more than one element
      for( int i = 0; i < checkboxlist.length; i++ )
      {
         if( checkboxlist[ i ].checked )
         {
            // do other stuff
         }
      }
  }
  
  
  
  I don't suffer from madness,
  I enjoy it every minute of my life
• • Reply
  

  linch12

  Member

  87 Points

  40 Posts

  Re: Get checkboxlist in javascript and check the status of the checkboxes

  Apr 26, 2006 03:41 PM|LINK

  Thank you for your reply. I have tried the codes

  In Orzeh's code, checklist.items.count returns 0 because the script is registered on page load before the checkboxlist is loaded.

  In Dyno1979b'code, checklistbox.length would return unidentified even there are more than one checkbox

  After the page is loaded, i opened the source code to search for the code for the checklistbox. There is nothing in the code not even the description. for example, I have a checkboxlist  as follow

  1. check unusual sound

  2. lubricate motor yearly

  3.clean blower wheel

  numbers are actually checkboxes on the page. In the source code, I did a search and could not find them in the code not mention the input tag for the checkboxes.

  Another thing I should have mentioned is that the checkboxlist is within a componentArt callback block. Would it make difference?

   

• • Reply
  

  orzeh

  Contributor

  4993 Points

  897 Posts

  Re: Get checkboxlist in javascript and check the status of the checkboxes

  Apr 26, 2006 06:33 PM|LINK

  linch12

  In Orzeh's code, checklist.items.count returns 0 because the script is registered on page load before the checkboxlist is loaded.

  
  
  checklist.items.count it server side code, so it can`t return 0 if you have added some checkboxitems.
  

  linch12

  Another thing I should have mentioned is that the checkboxlist is within a componentArt callback block. Would it make difference?

   

  
  

  try to put checkboxlist outside it and see what happens.
  

  orzeh
  
  

  code less, think more!
• • Reply
  

  Dyno1979b

  Participant

  1764 Points

  347 Posts

  Re: Get checkboxlist in javascript and check the status of the checkboxes

  Apr 27, 2006 06:57 AM|LINK

  Well if your checkboxes have different names, the only solution remains:
  for( var i = 0; i < form.items.length; i++ )
  {
      if( form.items[ i ].name.substring( 0, 10 ) == "ck_Partial" )
      {
            // my checkbox ... do something
      }
  }
  
  
  My previous approach worked only if the checkboxes had the same name and id. Otherwise they're completely different elements.
  
  
  I don't suffer from madness,
  I enjoy it every minute of my life
• • Reply
  

  NC01

  All-Star

  82577 Points

  15430 Posts

  MVP

  Re: Get checkboxlist in javascript and check the status of the checkboxes

  Apr 27, 2006 11:50 AM|LINK

  This should work with either CheckBoxLists or RadioButtonLists:

  <script language="JavaScript">
  <!--
  function readListControl()
  {
   var tableBody = document.getElementById('CheckBoxList1').childNodes[0];

   for (var i=0;i<tableBody.childNodes.length; i++)
   {
    var currentTd = tableBody.childNodes[i].childNodes[0];
    var listControl = currentTd.childNodes[0];

    if ( listControl.checked == true )
     alert('#' + i + ': is checked');
   }
  }
  // -->
  </script>

  NC...
  

• • Reply
  

  linch12

  Member

  87 Points

  40 Posts

  Re: Get checkboxlist in javascript and check the status of the checkboxes

  Apr 27, 2006 04:59 PM|LINK

  The javascript is registered when page is loaded before the checkboxlist is rendered with items ( there are two button click on the page to display the checkboxlist). That's why checkboxlist.item.count won't work in this case.

  I tried NC01's code. Works perfect. Thank you all for helping me out. very appreciated !!!!!

   

• • Reply
  

  jakkulas

  Member

  6 Points

  6 Posts

  Re: Get checkboxlist in javascript and check the status of the checkboxes

  Feb 04, 2008 10:13 PM|LINK

  NCO1 code works perfect..

  Regards
  Sreenivas.
• • Reply
  

  NC01

  All-Star

  82577 Points

  15430 Posts

  MVP

  Re: Get checkboxlist in javascript and check the status of the checkboxes

  Feb 05, 2008 11:47 AM|LINK

  Actually this will work even better since it does not depend on table structures.

  <script type="text/javascript">
  <!--
  ///////////////////////////////////////////////////////////////////
  // var containerId = '<%= CheckBoxList1.ClientID %>';
  // iterateListControl(containerId);
  ///////////////////////////////////////////////////////////////////
  function iterateListControl(containerId)
  {
   var containerRef = document.getElementById(containerId);
   var inputRefArray = containerRef.getElementsByTagName('input');

   for (var i=0; i<inputRefArray.length; i++)
   {
    var inputRef = inputRefArray[i];

    if ( inputRef.type.substr(0, 8) == 'checkbox' )
    {
     if ( inputRef.checked == true )
      alert('#' + i + ' (' + inputRef.id + ') is checked');
    }
   }
  }
  // -->
  </script>

  NC...