Hello and welcome to our community! Is this your first visit?
Register
Enjoy an ad free experience by logging in. Not a member yet? Register.
Results 1 to 8 of 8

Thread: Checkbox value

  1. #1
    Regular Coder
    Join Date
    May 2007
    Location
    Indonesia
    Posts
    164
    Thanks
    10
    Thanked 0 Times in 0 Posts

    Checkbox value

    Hi this is in response to my last question which was not replied to. Basically I'm trying to return a checkboxes value into the readonly text input. Here is my code for the latter all fuctioning well just this issue on da checkbox. This illustration used as demo for what is to be on my main form. Please help me on this one.
    Code:
    <HEAD>
    
    <script type="text/javascript">
    
    function checkBoxValidate(cb) {
    
    for (j = 0; j < 4; j++) {
    if (eval("document.myform.ckbox[" + j + "].checked") == true) {
    document.myform.ckbox[j].checked = false;
    if (j == cb) {
    document.myform.ckbox[j].checked = true;
             }
          }
    
       }
    }
    
    </script>
    </HEAD>
    
    
    
    <BODY>
    
    <form name=myform>
    Selection 1<input type="checkbox" name="ckbox" value"300" onClick="javascript:checkBoxValidate(0)"><br>
    Selection 2<input type="checkbox" name="ckbox" value="200" onClick="javascript:checkBoxValidate(1)"><br>
    Selection 3<input type="checkbox" name="ckbox" value="500" onClick="javascript:checkBoxValidate(2)"><br>
    Selection 4<input type="checkbox" name="ckbox" value="100" onClick="javascript:checkBoxValidate(3)"><br>
    <input type=text name=txt readonly onfocus "this.blur();">
    </form>
    
    </body>
    </html>

  • #2
    Regular Coder
    Join Date
    Jul 2007
    Location
    UK
    Posts
    223
    Thanks
    0
    Thanked 14 Times in 14 Posts
    Try this:
    Code:
    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
    <html>
     <head>
    <script type="text/javascript">
    function checkBoxValidate(cb) {
     for (j = 0; j < 4; j++) {
      if (document.myform.ckbox[j].checked) {
       document.myform.ckbox[j].checked = false;
       if (j == cb) {
        document.myform.ckbox[j].checked = true;
        document.myform.txt.value = document.myform.ckbox[j].value;
       }
      }
     }
    }
    </script>
    </head>
    <body>
    <form name="myform">
    Selection 1<input type="checkbox" name="ckbox" value="300" onclick="checkBoxValidate(0)"><br>
    Selection 2<input type="checkbox" name="ckbox" value="200" onclick="checkBoxValidate(1)"><br>
    Selection 3<input type="checkbox" name="ckbox" value="500" onclick="checkBoxValidate(2)"><br>
    Selection 4<input type="checkbox" name="ckbox" value="100" onclick="checkBoxValidate(3)"><br>
    <input type="text" name="txt" readonly>
    </form>
    </body>
    </html>
    Also I've got rid of the use of the eval() function which you don't need and added a few missing equals signs!

    Is there a reason why you're not using radio buttons instead of checkboxes?

  • #3
    Regular Coder
    Join Date
    May 2007
    Location
    Indonesia
    Posts
    164
    Thanks
    10
    Thanked 0 Times in 0 Posts
    I'm not using radio buttons for one simple reason even though its da norm, coz its more of a catch i reckon to use checkboxes but with radio buttons they are default only one can be chosen. Been searching for a way just to return the value of the box into readonly input, other parts of my actual code working though.Thanks anyway.

  • #4
    Regular Coder
    Join Date
    May 2007
    Location
    Indonesia
    Posts
    164
    Thanks
    10
    Thanked 0 Times in 0 Posts
    thanks bro works sweet as.

  • #5
    Regular Coder
    Join Date
    Jul 2007
    Location
    UK
    Posts
    223
    Thanks
    0
    Thanked 14 Times in 14 Posts
    No problem.

  • #6
    New Coder
    Join Date
    Aug 2007
    Posts
    20
    Thanks
    0
    Thanked 1 Time in 1 Post
    Hi,
    Pasted below is a possible solution to your problem.
    However, the first checkbox displays ON in my browser, instead of the values.
    rest is working fine. I have only changed the function.

    <HEAD>

    <script type="text/javascript">


    function checkBoxValidate(cb) {
    var value =0 ;
    /*

    //alert(document.myform.ckbox[cb].checked);

    if(document.myform.ckbox[cb].checked == true) {

    for(i=0;i<4;i++){

    if(document.myform.ckbox[i].checked == true) {

    value = value + document.myform.ckbox[i].value;

    }
    }

    //alert(value);
    //value = document.myform.ckbox[cb].value;
    document.myform.txt.value = value;

    }
    //if it is unchecked, we need to replace the existing ones
    else {
    value =0 ;
    for(i=0;i<4;i++){

    if(document.myform.ckbox[i].checked == true) {

    value = value + document.myform.ckbox[i].value;

    }
    }

    if(value == 0){
    document.myform.txt.value = "";
    }
    else {

    document.myform.txt.value = value;
    }
    }
    */

    for(i=0;i<4;i++){

    if(document.myform.ckbox[i].checked == true) {

    value = value + document.myform.ckbox[i].value;

    }
    }

    var len = value.length;
    var i=0;
    var str="";
    for(i = 1;i<len;i++)
    {
    str = str + value.charAt(i);

    }
    //alert(str);

    document.myform.txt.value = str;
    }
    </script>
    </HEAD>

    <BODY>

    <form name=myform>
    Selection 1<input type="checkbox" name="ckbox" value"300" onClick="javascript:checkBoxValidate(0)"><br>
    Selection 2<input type="checkbox" name="ckbox" value="200" onClick="javascript:checkBoxValidate(1)"><br>
    Selection 3<input type="checkbox" name="ckbox" value="500" onClick="javascript:checkBoxValidate(2)"><br>
    Selection 4<input type="checkbox" name="ckbox" value="100" onClick="javascript:checkBoxValidate(3)"><br>
    <input type=text name=txt readonly >
    </form>

    </body>
    </html>

  • #7
    Regular Coder
    Join Date
    Jul 2007
    Location
    UK
    Posts
    223
    Thanks
    0
    Thanked 14 Times in 14 Posts
    Thanks for the input amit, but I don't think he was after a script that added up the selected check boxes.
    Also I'd like to draw your attenttion to the parseInt() and parseFloat() functions, you may find them useful!

    Oh and the reason the first checkbox results in "ON" being displayed is because there is an equals sign missing from the first checkbox's value attribute.

  • #8
    Regular Coder
    Join Date
    May 2007
    Location
    Indonesia
    Posts
    164
    Thanks
    10
    Thanked 0 Times in 0 Posts
    thx for the help got my radio buttons to function. Just the alert message I added to it later to alert user to make a selection messed up kept cycling through the error message even after checkbox had been checked.
    tried pasting the alert message in different parts of script and error message kept popping up so I kinda flagged the idea of alerting user to make a selection.


  •  

    Posting Permissions

    • You may not post new threads
    • You may not post replies
    • You may not post attachments
    • You may not edit your posts
    •