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 10 of 10
  1. #1
    Regular Coder
    Join Date
    Jul 2002
    Location
    Raleigh, NC
    Posts
    484
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Radio validation

    I am looking for help to validate a form that I have. The textboxes are easy enought to validate, but the radio buttons are giving me headache.

    Check out what I've done so far:

    First Attempt
    http://www.ainspect.com/preview/keys...u/profile.html


    Second Attempt
    http://www.ainspect.com/preview/keys...ofile_new.html
    -WebMark Art
    Programming is 80% thinking and 20% spelling

  • #2
    Regular Coder
    Join Date
    Nov 2002
    Posts
    596
    Thanks
    0
    Thanked 0 Times in 0 Posts
    From your head to mine.

    One of the more entertaining radio broadcasts in a while. Actually two (2) validations in one: 'all entries required', and 'no doubles'.

    See if this helps:
    Code:
    function checkRadios(oForm) {
         var el, i = 0, grp, j, rad, which, num, firstEl, msg = 'The following entries were not completed:\n\n';
         while (el = oForm.elements[i++]) {
                if (el.type == 'radio') {
                    grp = oForm.elements[el.name];
                    j = 0;
                    while (rad = grp[j++])
                           if (rad.checked)
    	                   break;
                    if (j > grp.length) {
                        if (!firstEl) firstEl = grp[0];
                        num = parseInt(el.name);
                        if (msg.indexOf('[ ' + num + ' ]') == -1) 
                            msg += '\t[ ' + num + ' ]\n';
                }
                    i += grp.length - 1;
             }
          }
         if (msg != 'The following entries were not completed:\n\n') {
                        alert(msg);
                        firstEl.focus();
    	            return false;
       }
         return true;
    }
    
    function getIndex(oElement) {
         var el, idx = 0, oForm = oElement.form;
         while (el = oForm.elements[idx]) {
                if (el == oElement) 
                    return idx;
                    ++idx;
       }
         return null;
    }
    
    
    function no_doubles(oCheckbox, after) {
         if (oCheckbox.checked) {
             var offset, oForm = oCheckbox.form;
             offset = (after) ? 4 : -4;
             if (oForm.elements[getIndex(oCheckbox) + offset].checked) {
                 alert('"most" and "least" must be different!');
                 return false;
          }
         return true;
       }
    }
    Call:

    <td align="center"><FONT SIZE="-2"><B>1</B></FONT></td>
    <td><FONT SIZE="-2">expressive<BR>compliant<BR>forceful<BR>restrained</FONT></td>
    <td align="center"><INPUT TYPE="radio" NAME="1M" VALUE="expressive" onclick="return no_doubles(this, true)"><br><INPUT TYPE="radio" NAME="1M" VALUE="compliant" onclick="return no_doubles(this, true)"><BR><INPUT TYPE="radio" NAME="1M" VALUE="forceful" onclick="return no_doubles(this, true)"><br><INPUT TYPE="radio" NAME="1M" VALUE="restrained" onclick="return no_doubles(this, true)"></td>
    <td align="center"><INPUT TYPE="radio" NAME="1L" VALUE="expressive" onclick="return no_doubles(this)"><br><INPUT TYPE="radio" NAME="1L" VALUE="compliant" onclick="return no_doubles(this)"><BR><INPUT TYPE="radio" NAME="1L" VALUE="forceful" onclick="return no_doubles(this)"><br><INPUT TYPE="radio" NAME="1L" VALUE="restrained" onclick="return no_doubles(this)"></td> <td align="center"><FONT SIZE="-2"><B>2</B></FONT></td>
    <td><FONT SIZE="-2">risk-taker<br>talkative<br>persistent<br>soft-spoken</FONT></td>
    <td align="center"><INPUT TYPE="radio" NAME="2M" VALUE="risk-taker" onclick="return no_doubles(this, true)"><br><INPUT TYPE="radio" NAME="2M" VALUE="talkative" onclick="return no_doubles(this, true)"><BR><INPUT TYPE="radio" NAME="2M" VALUE="persistent" onclick="return no_doubles(this, true)"><br><INPUT TYPE="radio" NAME="2M" VALUE="soft-spoken" onclick="return no_doubles(this, true)"></td>
    <td align="center"><INPUT TYPE="radio" NAME="2L" VALUE="risk-taker" onclick="return no_doubles(this)"><br><INPUT TYPE="radio" NAME="2L" VALUE="talkative" onclick="return no_doubles(this)"><BR><INPUT TYPE="radio" NAME="2L" VALUE="persistent" onclick="return no_doubles(this)"><br><INPUT TYPE="radio" NAME="2L" VALUE="soft-spoken" onclick="return no_doubles(this)"></td>
    <td align="center"><FONT SIZE="-2"><B>3</B></FONT></td>
    <td><FONT SIZE="-2">adventurous<br>energetic<br>withdrawn<br>contented</FONT></td>


    One problem: I think you mislabeled a couple of them radios...

    hth, cbp
    Last edited by cheesebagpipe; 07-02-2003 at 02:49 AM.

  • #3
    Kor
    Kor is offline
    Red Devil Mod Kor's Avatar
    Join Date
    Apr 2003
    Location
    Bucharest, ROMANIA
    Posts
    8,478
    Thanks
    58
    Thanked 379 Times in 375 Posts

    well

    If I well understood, the problem is less complicated. You have to validate something "or../..or" from a pair of radio buttons. When validate one of the radion button, the other must loose the check.

    If this is the problem, the solve is simple, give to both radio buttons the same name, and that will validate only one at a time, but not both of them. Of course, give them different values...

    After all, when sending to the CGI, the form validates the values associated to names, not otherwise.

    That is true ,also, for more than two radio buttons when must validate the same entrance.
    KOR
    Offshore programming
    -*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*

  • #4
    Regular Coder
    Join Date
    Jul 2002
    Location
    Raleigh, NC
    Posts
    484
    Thanks
    0
    Thanked 0 Times in 0 Posts
    I am aware that some of the names are misspelled (just a part of the trial and error and error and error).

    I tried the provided script, but it didn't work.

    There are 24 questions (the radio buttons). A user must select a most value and a least value from each question. I need to validate that a most value has been selected for each and a least has been selected for each.
    -WebMark Art
    Programming is 80% thinking and 20% spelling

  • #5
    Kor
    Kor is offline
    Red Devil Mod Kor's Avatar
    Join Date
    Apr 2003
    Location
    Bucharest, ROMANIA
    Posts
    8,478
    Thanks
    58
    Thanked 379 Times in 375 Posts
    It is not clear to me wether user must select ...most OR least..., or ... most AND least...

    Anyway

    1. if there is a "either...or" choose, as I said, give both radios the same name but different values .

    ex
    for first question
    <input type="radio" name="question1" value="most">
    <input type="radio" name="question1" value="least">

    in this case, on submit is sended to the CGI either the "most" value, or the "least" value, but not both (you can see even that you can not check both...)

    2. If you have multiple choices...hm... you must use different names for radios, any case

    ex
    for first question
    <input type="radio" name="question1a" value="most">
    <input type="radio" name="question1b" value="least">

    In this case, on submit is sended to the CGI both "most" value, and value each oh his name (question1a and question1b)... Well... here I presume that you must arrange the CGI script to return that two values in the same group, say "question1" which contain those two names, question1a and question1b...
    KOR
    Offshore programming
    -*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*

  • #6
    Regular Coder
    Join Date
    Jul 2002
    Location
    Raleigh, NC
    Posts
    484
    Thanks
    0
    Thanked 0 Times in 0 Posts
    The instructions just above the form specify AND. Users have to select a value for each question MOST AND LEAST. In other words there will be two values for each question. There is no cgi processing, the values are being passed to an asp page which formats the values and mails it to the owner of the site.

    The values passed look like:

    Question 1 Most: xxxxxx
    Question 1 Least: yyyyyy

    Question 2 Most: xxxxxx
    Question 2 Least: yyyyyy

    ect.

    All of the most values for each question have the same name and all of the least values for each question have the same name. (this prevents more than one value for each question).
    -WebMark Art
    Programming is 80% thinking and 20% spelling

  • #7
    Senior Coder
    Join Date
    Aug 2002
    Posts
    3,467
    Thanks
    0
    Thanked 0 Times in 0 Posts
    This can easily be done with fValidate

    I took the liberty of duplicating a small part of your form here, on which I setup fValidate validation. Took 3 minutes.
    My Site | fValidate | My Brainbench | MSDN | Gecko | xBrowser DOM | PHP | Ars | PVP
    “Minds are like parachutes. They don't work unless they are open”
    “Maturity is simply knowing when to not be immature”

  • #8
    Regular Coder
    Join Date
    Jul 2002
    Location
    Raleigh, NC
    Posts
    484
    Thanks
    0
    Thanked 0 Times in 0 Posts
    That is EXACTLY what I wanted!! Thanks so much!
    -WebMark Art
    Programming is 80% thinking and 20% spelling

  • #9
    Regular Coder
    Join Date
    Nov 2002
    Posts
    596
    Thanks
    0
    Thanked 0 Times in 0 Posts
    The script I posted works. Fine.

    It also prevents the user from selecting the same choice for any 'least' & 'most'. Isn't that logical?

  • #10
    Regular Coder
    Join Date
    Jul 2002
    Location
    Raleigh, NC
    Posts
    484
    Thanks
    0
    Thanked 0 Times in 0 Posts
    I kept getting an error when ai tried to use it. I'm sure I scewed something up when I copied it but I tried a few times and kept getting errors. Thanks Everyone who helped!
    -WebMark Art
    Programming is 80% thinking and 20% spelling


  •  

    Posting Permissions

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