SitePoint Sponsor

User Tag List

Results 1 to 7 of 7
  1. #1
    SitePoint Member
    Join Date
    Jan 2005
    Location
    Buffalo, NY
    Posts
    6
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    Ok! Now I need You all! Radio Option Array Problem!

    I have to say that I am still learning as I go, when it comes to Javascript functions...

    Well here is what I need..I need to select specific options within various radio option arrays, whenever one radio option is selected??? ok I think that I might have confused myself with that explaination..

    I have one radio button called "naALL" with one option..if this is selected then I need other radio groups selected.

    As an example here is what these groups look like :
    1a) input type = radio name = "Crossell" value = "Met"
    1b) input type = radio name = "Crossell" value = "Not Met"
    1c) input type = radio name = "Crossell" value = "N/A"

    I have five groups in total that need to be changed to N/A, once the "naALL" is selected...does this make sense? It is supposed to save the time for my users to have to check the N/A for all of them when they could do it by one click..

    Here is code that I am playing with:
    Code:
    function naAll() {
    	var crsellNA = f2['Crossell'];
    	var crsellNA_ln=crsellNA.length;
    
    	for(var i=0;i<crsellNA_ln;i++){
    		if(f2['naALL'].checked){
    			document.f2.Crossell[3].checked
    		} 
    }
    }
    I do not think that I am even close...

  2. #2
    ☆★☆★ silver trophy vgarcia's Avatar
    Join Date
    Jan 2002
    Location
    in transition
    Posts
    21,236
    Mentioned
    1 Post(s)
    Tagged
    1 Thread(s)
    Code:
    function naAll( formId )
    {
      //get non-DOM browsers outta here
      if ( !document.getElementById && !document.getElementsByTagName ) return;
    
      var fis = document.getElementById( formId ).getElementsByTagName( "input" );
      var i = 0, thisInput;
      while ( thisInput = fis[i++] )
      {
        if ( thisInput.getAttribute( "type" ) == "radio" && thisInput.getAttribute( "value" ) == "N/A")
        {
           thisInput.setAttribute( "checked", "checked" );
        }
      }
    }
    All you have to do is pass the ID of the form you want this operation to take place on. So for example, if your form's ID was "myForm", you could activate it like so:
    HTML Code:
    <input type="button" onclick="naAll('myForm');" />

  3. #3
    SitePoint Member
    Join Date
    Jan 2005
    Location
    Buffalo, NY
    Posts
    6
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    That all makes sense...but where in the function am I locating the specific radio groups within the form?

    I could be wrong, but it looks like it will set "N/A" to all elements within the form....

    I will start this function from the onclick of the main radio button called "naALL"...right?

    I appreciate this very mcuh...

  4. #4
    ☆★☆★ silver trophy vgarcia's Avatar
    Join Date
    Jan 2002
    Location
    in transition
    Posts
    21,236
    Mentioned
    1 Post(s)
    Tagged
    1 Thread(s)
    Quote Originally Posted by Salnick4
    That all makes sense...but where in the function am I locating the specific radio groups within the form?

    I could be wrong, but it looks like it will set "N/A" to all elements within the form....
    Any radio button group with a "N/A" option will have that option checked according to the function I wrote. If you have radio button groups with "N/A" options that you don't want checked, then we'll have to come up with something else.
    Quote Originally Posted by Salnick4
    I will start this function from the onclick of the main radio button called "naALL"...right?
    You can set it there if you'd like.

  5. #5
    SitePoint Member
    Join Date
    Jan 2005
    Location
    Buffalo, NY
    Posts
    6
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Yea...I need only specific "N/A" options to be selected when the first radio option is clicked on...

    I was thinking that maybe I could set the checked property of those specific radio's to true when the first radio button is selected....something like:

    If (document.f2.naALL.checked) {
    document.f2.Crossell[3].checked;
    document.f2.FAB[3].checked;
    document.f2.Dsclsr[3].checked;
    document.f2.clientC[3].checked;
    document.f2.Prod[3].checked;
    }

    But I do not think that you can access the array number that way...the above number would be the last option in those specific arrays, which correspond to their underlying value of "N/A"...

    What do you think...is this doable???

  6. #6
    ☆★☆★ silver trophy vgarcia's Avatar
    Join Date
    Jan 2002
    Location
    in transition
    Posts
    21,236
    Mentioned
    1 Post(s)
    Tagged
    1 Thread(s)
    Let's try this again then. Now we have two parameters: the ID of the form, and an array of radio button names that you want checked.

    Code:
    function naAll( formId, radioArray )
    {
      //get non-DOM browsers outta here
      if ( !document.getElementById && !document.getElementsByTagName ) return;
    
      var fis = document.getElementById( formId ).getElementsByTagName( "input" );
      var i = 0, thisInput, j = 0;
      //loop through all inputs
      while ( thisInput = fis[i++] )
      {
        //if the input is a radio button and its option is N/A, check its name against the array members
        if ( thisInput.getAttribute( "type" ) == "radio" && thisInput.getAttribute( "value" ) == "N/A")
        {
           //loop through array
           for ( j = 0; j < radioArray.length; j++ )
           {
              //if this input's name is in the array member list, check the item.
             if ( thisInput.getAttribute("name") == radioArray[j] )
             {
              thisInput.setAttribute( "checked", "checked" );
             }
            }
        }
      }
    }
    Call it like so:
    Code:
    <input type="button" value="N/A All" onclick="naAll('myForm', new Array('field1', 'field2', 'field3', 'field4'));" />

  7. #7
    SitePoint Member
    Join Date
    Jan 2005
    Location
    Buffalo, NY
    Posts
    6
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Here is what I had before I saw your reply, I change the initial radio button to a checkbox and made this simple function:

    Code:
    function naAll()
    {
      if (document.f2.naALL.checked=true) {
    	document.f2.Crossell[3].checked=true;
    	document.f2.FAB[2].checked=true;
    	document.f2.Dsclsr[2].checked=true;
    	document.f2.ClientC[2].checked=true;
    	document.f2.Persuade[3].checked=true;
     } else {
    	document.f2.Crossell[3].checked=false;
    	document.f2.FAB[2].checked=false;
    	document.f2.Dsclsr[2].checked=false;
    	document.f2.ClientC[2].checked=false;
    	document.f2.Persuade[3].checked=false;
    }
    }
    It works like I want, but I was hoping that when the checkbox is unchecked it would then revert the selected radio options back to their original state...but that is not the case.

    What do you think of this, and any suggestions on the latter part of reverting to unchecked once the check box is unchecked???

    Thank you for you submission and further assistance!!!!


Bookmarks

Posting Permissions

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