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 5 of 5
  1. #1
    New to the CF scene
    Join Date
    Nov 2006
    Posts
    3
    Thanks
    0
    Thanked 0 Times in 0 Posts

    How to control a radio button named id[15]

    Hi all,

    Can anyone help me with setting a radio button which is unfortunately named "id[15]" using javascript ?

    I have html as below

    <tr><td class="main"><input type="radio" name="id[15]" value="18" CHECKED>Up to 5</td></tr>
    <tr><td class="main"><input type="radio" name="id[15]" value="19">Up to 7</td></tr>

    I can't easily change the name of the radio button since it's an attribute of a shopping site and is generated by it's admin client.

    So if the radio button was named radiobtnname, I think I'd need code like..

    document.sampleform.radiobtnname[19].click()

    but instead I'm stuck with

    document.sampleform.id[15][19].click()

    which javascript doesn't like.

    Any help much appreciated.

  • #2
    Regular Coder
    Join Date
    Nov 2002
    Location
    Bristol, UK
    Posts
    932
    Thanks
    0
    Thanked 0 Times in 0 Posts
    document.sampleform["id[15]"].click()
    ithium | SOAPI | SDP | PTPScript manual
    "ithium is a non-profit webhost, which is pretty much unique. The mission of ithium is to provide free hosting resources for worthwhile and needy non-profit projects, which otherwise may not be able to obtain such facilities. The money from commercial customers goes to maintain ithium's servers and further development."

  • #3
    New to the CF scene
    Join Date
    Nov 2006
    Posts
    3
    Thanks
    0
    Thanked 0 Times in 0 Posts
    Many thanks krycek for the speedy response. I'm probably missing your hint
    because I still can't get it working.

    I'll try to explain...

    I have a radio group named "id[15]" (a very unhelpful name because of the [] in it) where currently the checked radio button is value 18. I need to change it to 19.

    So I'm trying things like

    document.sampleform.id[15][19].click()

    or

    document.sampleform["id[15]"[19]].click()

    but I get various js errors.

    I'll past in the whole html below.. part of the script here is from Dynamic Drive. See the comment /**** IN HERE I'D LIKE TO SET THE RADIO BUTTON ********/

    I'm testing it by typing more than 5 chars into the text box.

    Many thanks for any help.



    <html>
    <head>

    <script type="text/javascript">

    /*
    Form field Limiter script- By Dynamic Drive
    For full source code and more DHTML scripts, visit http://www.dynamicdrive.com
    This credit MUST stay intact for use
    */

    var ns6=document.getElementById&&!document.all

    function restrictinput(maxlength,e,placeholder){
    if (window.event&&event.srcElement.value.length>=maxlength)
    return false
    else if (e.target&&e.target==eval(placeholder)&&e.target.value.length>=maxlength){
    var pressedkey=/[a-zA-Z0-9\.\,\/]/ //detect alphanumeric keys
    if (pressedkey.test(String.fromCharCode(e.which)))
    e.stopPropagation()
    }
    }

    function countlimit(maxlength,e,placeholder){
    var theform=eval(placeholder)
    var lengthleft=maxlength-theform.value.length

    /**** IN HERE I'D LIKE TO SET THE RADIO BUTTON ********/
    if ( theform.value.length > 5 )
    {
    document.sampleform["id[15]"[19]].click()
    }


    var placeholderobj=document.all? document.all[placeholder] : document.getElementById(placeholder)
    if (window.event||e.target&&e.target==eval(placeholder)){
    if (lengthleft<0)
    theform.value=theform.value.substring(0,maxlength)
    placeholderobj.innerHTML=lengthleft
    }
    }


    function displaylimit(thename, theid, thelimit){
    var theform=theid!=""? document.getElementById(theid) : thename
    var limit_text='<b><span id="'+theform.toString()+'">'+thelimit+'</span></b> characters remaining on your input limit'
    if (document.all||ns6)
    document.write(limit_text)
    if (document.all){
    eval(theform).onkeypress=function(){ return restrictinput(thelimit,event,theform)}
    eval(theform).onkeyup=function(){ countlimit(thelimit,event,theform)}
    }
    else if (ns6){
    document.body.addEventListener('keypress', function(event) { restrictinput(thelimit,event,theform) }, true);
    document.body.addEventListener('keyup', function(event) { countlimit(thelimit,event,theform) }, true);
    }
    }

    </script>

    </head>
    <body>

    <form name="sampleform">

    <input type="text" name="george" size=20><br>
    <script>
    displaylimit("document.sampleform.george","",5)
    </script>
    <p>

    <table>
    <tr><td class="main"><input type="radio" name="id[15]" value="18" CHECKED>Up to 5</td></tr>
    <tr><td class="main"><input type="radio" name="id[15]" value="19">Up to 7</td></tr>
    <tr><td class="main"><input type="radio" name="id[15]" value="20">Up to 10</td></tr>
    <tr><td class="main"><input type="radio" name="id[15]" value="21">Up to 12</td></tr>
    </table>


    <tr><td class="main"><input type="radio" name="id[15]" value="18" CHECKED>Up to 5</td></tr>
    <tr><td class="main"><input type="radio" name="id[15]" value="19">Up to 7</td></tr>
    </form>
    </body>
    </html>

  • #4
    Banned
    Join Date
    May 2006
    Location
    England
    Posts
    664
    Thanks
    0
    Thanked 84 Times in 84 Posts
    Quote Originally Posted by RobBass View Post
    Many thanks krycek for the speedy response. I'm probably missing your hint
    because I still can't get it working.

    I'll try to explain...

    I have a radio group named "id[15]" (a very unhelpful name because of the [] in it) where currently the checked radio button is value 18. I need to change it to 19.

    So I'm trying things like

    document.sampleform.id[15][19].click()

    or

    document.sampleform["id[15]"[19]].click()
    The only way is to loop through the array (if there's more than one button) and find the one with the specifed value and set its checked property to true. Try this function:
    Code:
    /* Nothing to do with dynamicdrive :) */
    
    function selectRadioByValue( rbSet, rbValue )
    {               
     /*4172747920456666656D206469642074686973*/  
     var setOK=false; 
       
     if(rbSet.length)
     {
      for(var i=0; i<rbSet.length && rbSet[i].value!=rbValue ; i++)
      {}
      if(i!=rbSet.length)
      {
       rbSet[i].checked=true;
       setOK=true;
      } 
     } 
     else
      if(rbSet.value==rbValue) //single button
      {
        rbSet.checked=true;  
        setOK=true;
      }
        
     return setOK;   
    }
    In this case the call would be:
    Code:
    selectRadioByValue( document.forms.sampleform['id[15]'], "19" );

  • #5
    New to the CF scene
    Join Date
    Nov 2006
    Posts
    3
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Smile

    Thanks Arty Effem. That script worked perfectly.

    Took me a while to get my head around what you were doing there. Nice one.


  •  

    Posting Permissions

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