在允许用户进入下一部分之前,在表单验证中检查是否单击了某个选项(单选按钮)


checking on form validation whether a choice has been clicked (radio button) before allowing user onto the next section

我的html页面上有一份包含五个问题的多选问卷。每个问题都使用单选按钮,用户可以从五个答案中选择一个。在允许用户转到另一个页面之前,我想检查用户是否已经选择了这五个单选按钮中的一个。PHP页面将答案发送到我的数据库。如果用户未检查其中一个答案,则没有任何答案进入数据库。我想我正在寻找一些java脚本,它将遍历可能的五个答案中的每一个,以在表单提交中检查用户是否选中了一个单选按钮,然后再允许他们进入下一页。谢谢你的帮助。我的两个问题的html代码如下:

<tr> <td> Question 1.  </td> 
<td  align="center"> <input type="radio" name="q1" value="0" /></td>
<td  align="center"> <input type="radio" name="q1" value="1" /> </td>
<td  align="center"> <input type="radio" name="q1" value="2" /> </td>
 <td  align="center"> <input type="radio" name="q1" value="3" /> </td>
 <td  align="center"> <input type ="radio" name="q1" value="4" /> </td> 
 </tr>
 <tr> <td> Question 2.  </td>
 <td  align="center"><input type="radio" name="q2" value="0"/></td>
 <td  align="center"> <input type="radio" name="q2" value="1"/> </td>
 <td  align="center"> <input type="radio" name="q2" value="2"/> </td>
 <td  align="center"> <input type="radio" name="q2" value="3"/> </td>
 <td  align="center"> <input type ="radio" name="q2" value= "4"/> </td> </tr>

考虑以下示例。。并对代码进行更改。。。。。您可以调用一个js函数(使用onsubmit())。像这个

<form id="ID" method="post" action="servletName" onSubmit="return validateOption()">
<input type=radio name=r1 value="1" >A</input>
<input type=radio name=r1 value="2">B</input>
<input type="submit" value="Submit"><span id="error" style="display:none;"></span>
</form>

您的脚本将在此处验证是否选择了选项,只有当onsubmit=true时,即validateOption()返回true时,才可以提交页面。

<script>
function validateOption()
{
    var group=document.getElementsByName("r1");
     for ( var i = 0; i < group.length; i++)
     { 
         if (group[i].checked) 
             return true;
             }
        // else you can show error message like this
        document.getElementById("error").innerHTML="Please enter your choice";
        return false;
    }
</script>