0

我有一个包含多个问题的表格(动态创建的问卷)。我使用 jQuery 将收音机样式设置为按钮(http://jqueryui.com/demos/button/#radio),但我在这里稍微减少了代码......

<div class="yesnoradios">
    <input type="radio" name="section<%= section %>_question<%= question %>" id="section<%= section %>_question<%= question %>_Y" value="Y" />Yes
    <input type="radio" name="section<%= section %>_question<%= question %>" id="section<%= section %>_question<%= question %>_N" value="N" />No
    <input type="radio" name="section<%= section %>_question<%= question %>" id="section<%= section %>_question<%= question %>_NA" value="NA" />N/A
</div>

所以,我有上面的多个实例,动态命名id的。

我正在努力在客户端验证提交时的表单。我需要做的是确保为每个问题选择一个答案。我没有很多 jQuery 经验,所以到目前为止我所做的只是围绕每个问题进行循环。

$('.yesnoradios').each(function(index) {
    alert($(this).attr("id"));
});

我想我会提到,在查看英文页面时,它使用select的是 's 而不是单选按钮,我可以很好地验证,但在这种情况下我不能使用它的原因是用户正在查看页面中的“是”或“否”的等价物根据您如何构建问题而有所不同,因此我使用的是勾号和叉号。

提前感谢您的帮助。

编辑:我试图做的是使用 .children() 函数来检查一个是否被选中,如果没有设置一个标志,表明表单无效。但是我无法正确使用语法,并且还没有找到一个好的代码示例。

4

3 回答 3

4

假设您有很多以下...

<div class="yesnoradios">
    <input type="radio" name="section<%= section %>_question<%= question %>" id="section<%= section %>_question<%= question %>_Y" value="Y" />Yes
    <input type="radio" name="section<%= section %>_question<%= question %>" id="section<%= section %>_question<%= question %>_N" value="N" />No
    <input type="radio" name="section<%= section %>_question<%= question %>" id="section<%= section %>_question<%= question %>_NA" value="NA" />N/A
</div>

您可以使用以下代码查看是否至少选择了所有组中的一个

$('.yesnoradios input[type=radio]:checked').length

这将为您提供已检查的组的确切编号。使用 no 进行检查,class="yesnoradios"如果您的 no 相同,则每个 yesnoradio div 中至少有一个收音机已被检查

if($('.yesnoradios').length == $('.yesnoradios input[type=radio]:checked').length){
    //all groups have at least one radio checked
}else{
    //not all are chedked and you can loop your else logic here
}

注意:一组中的所有收音机都应该具有相同的名称......并且由于您在此处发布了未渲染的 html,因此我假设它确实如此。

于 2012-07-13T10:07:58.390 回答
3
if ($('input[name='+ radioName +']:checked').length) {
           // at least one of the radio buttons was checked
           return true; // allow whatever action would normally happen to continue
      }
      else {
           // no radio button was checked
           return false; // stop whatever action would normally happen
      }
于 2012-07-13T09:50:31.333 回答
0

试试这个。你的 html 应该像

radio buttons with class "optionCls" in a div with id question1
radio buttons with class "optionCls" in a div with id question2
.
.

现在你可以像这样引用它

if($('#question1.optionCls :checked').length() > 0) 
     alert('valid'); //will tell you for question1 whether answer is selected or not

构建您的逻辑以使其具有动态性

于 2012-07-13T10:03:36.407 回答