Question

I am trying to get a validation process to work using Javascript, my form has four radio buttons and one submit button, and I wanted to make it so if the user clicks submit and no radio buttons are selected then it pops up an alert and doesn’t submit the form. Here’s what my form looks like:

<form method="post" name="inform">
If you checked off <span style="text-decoration:underline">any</span> problems, how  <span style="text-decoration:underline">difficult</span> have these problems made it for you to do your work take care of things at home or get along with other people?
<table id="lastquestion">
<tr>
<td>Not difficult at all</td>
<td>Somewhat difficult</td>
<td>Very difficult</td>
<td>Extremely Difficult</td>
</tr><tr>
<td style="text-align:center"><input type="radio" value="not difficult at all" name="finalquestion" /></td>
<td style="text-align:center"><input type="radio" value="somewhat difficult" name="finalquestion" /></td>
<td style="text-align:center"><input type="radio" value="very difficult" name="finalquestion" /></td>
<td style="text-align:center"><input type="radio" value="extremely difficult" name="finalquestion" /></td>
</tr>
</table>
<input type="hidden" value="<?php echo $totalScore; ?>" name="totalScore" />
<input type="submit" value="Submit Final Answer" name="submit" onclick="return validate(inform)" />
</form>

And here’s what the script looks like:

function validate(formCheck)
{
    if(formCheck.finalquestion == "")
    {
        alert("Please Choose an option");
        return false;
    }
    else
    {
        return true;
    }
}

But for some reason my button is submitting no matter what, Any advice here would help, thank you!

UPDATE: I have tried selecting a radio and then alerting in the validate function and formCheck.finalquestion prints: [object NodeList], so I don’t think the value of which button is selected is going through properly.

Answer 1

You are relying on naming behaviour that works only in IE: Only that browser provides a global Javascript variable xyz (or, to be more exact, window.xyz) for each element with that name.

To specify the form, use submit button’s form attribute. It is always a reference to the form object:

return validate(this.form);

To get the element of a radio button, you need to specify the value attribute. Use

if(formCheck.elements.finalquestion.value == "")