Solved

Zero a checkbox object from a script

Posted on 2002-07-18
5
525 Views
Last Modified: 2012-06-21
Hi,

I have a number of lines which uses some checkboxes in html like this:

<td>
<input type='checkbox' name='XXXcb' value='1' onclick='unCheckOthers(this);'>
<input type='checkbox' name='XXXcb' value='2' onclick='unCheckOthers(this);'>"
<input type='checkbox' name='XXXcb' value='3' onclick='unCheckOthers(this);'>"
</td>

and the unCheckOthers JS function looks like this:

function unCheckOthers(obj)
{
     var objGroup = obj.form[obj.name];
     var boxEmpty = true;
     
     for (var i = 0; i < objGroup.length; i++)
     {
          if (objGroup[i] != obj)
               objGroup[i].checked = false;

          if (objGroup[i].checked == true)
               boxEmpty = false;
     }

     if (boxEmpty == true)
          // checkbox has been unclicked, set value to zero
               obj.value = 0;
         
}

The first part of the js code unchecks the other two  checkboxes when one is clicked (making it somewhat in a radiobutton fashion, but with the option to zero all checkboxes), and that works fine. The old checking is removed when I click a new one.

Now, what I want is that whenever someone unclicks ALL of the checkboxes, the value of 'XXXcb' in the html shall be set to zero, from this javascript. It doesn't work when I set obj.value to 0, nor does it work if I loop through objGroup again to set all of those values to 0.

I MUST do this dynamically, as the X's in the name 'XXXcb' name can be quite a large number of different values.

Any help would be appreciated.

Thanks,
/Isidor
0
Comment
Question by:isidor
  • 4
5 Comments
 
LVL 33

Expert Comment

by:knightEknight
ID: 7162438
you are trying to set the value of the whole group to 0 ... I don't think you can do that, you can only set the value of individual checkboxes to 0.  ... and if you want that 0 to be posted to the server, you will have to put it in a hidden field by the same name ... either that or set the value of a checked checkbox to 0.
0
 
LVL 33

Expert Comment

by:knightEknight
ID: 7162444
try this:

<td>
<input type='checkbox' name='XXXcb' value='1' onclick='unCheckOthers(this);'>
<input type='checkbox' name='XXXcb' value='2' onclick='unCheckOthers(this);'>"
<input type='checkbox' name='XXXcb' value='3' onclick='unCheckOthers(this);'>"
<input type='hidden' name='XXXcb' value="">
</td>




function unCheckOthers(obj)
{
    var objGroup = obj.form[obj.name];
   
    for (var i=0,n=objGroup.length; i<n; i++)
    {
         if (objGroup[i] != obj)
              objGroup[i].checked = false;
    }
}
0
 
LVL 33

Expert Comment

by:knightEknight
ID: 7162462
oops, I left out the most important part!  ... but it wasn't going to work as I had thought anyway, so let me play with it and get back to you.
0
 
LVL 33

Accepted Solution

by:
knightEknight earned 100 total points
ID: 7162497
ok, here is one way to do it.

Place a hidden field of the same name BEFORE the checkboxes (to give it an index of 0):

   <input type='hidden'   name='XXXcb' value='0'>
   <input type='checkbox' name='XXXcb' value='1' onclick='unCheckOthers(this);'>
   <input type='checkbox' name='XXXcb' value='2' onclick='unCheckOthers(this);'>
   <input type='checkbox' name='XXXcb' value='3' onclick='unCheckOthers(this);'>



then make your function look like this:

function unCheckOthers(obj)
{
   var objGroup = obj.form[obj.name];
   objGroup[0].value="";

   for (var i=1,n=objGroup.length; i<n; i++)
   {
        if (objGroup[i] != obj)
             objGroup[i].checked = false;
        else if ( obj.checked==false )
             objGroup[0].value="0";
   }

 //alert(objGroup[0].value);
}
0
 
LVL 1

Author Comment

by:isidor
ID: 7164232
Great code, knightEknight. I got it working the way I wanted it to.

Thanks a lot!
/isidor
0

Featured Post

Courses: Start Training Online With Pros, Today

Brush up on the basics or master the advanced techniques required to earn essential industry certifications, with Courses. Enroll in a course and start learning today. Training topics range from Android App Dev to the Xen Virtualization Platform.

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

Suggested Solutions

Article by: DanRollins
This article describes a JavaScript program that creates a maze made of hexagonal cells.  In Part 2 (http://www.experts-exchange.com/Programming/Languages/Scripting/JavaScript/A_7850-Hex-Maze-Part-2.html), we'll extend the program by adding a depth-…
In Part 1 (http://www.experts-exchange.com/Programming/Languages/Scripting/JavaScript/A_7849-Hex-Maze.html) we covered the hexagonal maze basics -- how the cells are represented in a JavaScript array and how the maze is displayed.  In this part, we'…
The viewer will learn the basics of jQuery, including how to invoke it on a web page. Reference your jQuery libraries: (CODE) Include your new external js/jQuery file: (CODE) Write your first lines of code to setup your site for jQuery.: (CODE)
The viewer will learn the basics of jQuery including how to code hide show and toggles. Reference your jQuery libraries: (CODE) Include your new external js/jQuery file: (CODE) Write your first lines of code to setup your site for jQuery…

815 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question

Need Help in Real-Time?

Connect with top rated Experts

12 Experts available now in Live!

Get 1:1 Help Now