RadioButtonList 用 javascript 检查答案

【问题标题】：RadioButtonList checked with javascriptRadioButtonList 用 javascript 检查
【发布时间】：2012-12-17 18:16:30
【问题描述】：

我正在尝试一个由 RadioButtonList rblstPallet 组成的简单验证。我尝试了以下代码：

javascript

var rblstPallet = document.getElementById('rblstPallet');
var counter = 0;
for (var intCount = 0; intCount < rblstPallet.length; intCount++) {
    if (rblstPallet[intCount].checked) {  //this step is not working
        console.log(intCount); //I checked using this step
        counter++;
    }
}
if (counter == 0) {        
    //MSG: please select any item
}
else {
    // Redirect to next page function
}

.aspx

<asp:RadioButtonList ID="rblstPallet" runat="server" RepeatDirection="Horizontal">
     <asp:ListItem>Wood</asp:ListItem>
     <asp:ListItem>Plastic</asp:ListItem>
     <asp:ListItem>None</asp:ListItem>
</asp:RadioButtonList>

问题是，如果我什至选择了一个单选按钮，那么counter 的值也保持不变。当我调试代码时，我才知道那行

if (rblstPallet[intCount].checked) {

甚至没有执行，甚至没有在控制台中显示任何错误。我正在经历这个link。我试过这个link（不工作）。

请帮忙。

【问题讨论】：

标签： javascript asp.net html

【解决方案1】：

RadioButtoList 转换为单选按钮，其 id 与 radiobuttonlist id 相似，您需要通过 DOM 找到 iterate 以找到 matching 元素。

function getRadioButtonListSelections(radioButtonListName)
{
     int selectionCount = 0;
     for(i=0;i<document.forms[0].length;i++)
     {
            e=document.forms[0].elements[i];
            if (e.id.indexOf(radioButtonListName) != -1 && e.checked)
                selectionCount++;
     }  
     return selectionCount; 
}       

alert(getRadioButtonListSelections('rblstPallet'));

【讨论】：

谢谢你，这正在工作......直到现在我无法理解它，因为我是初学者...... :)
for 循环遍历表单元素当前我们正在遍历具有零索引 document.forms[0] 的表单。元素集合为您提供表单元素[i] 的对象。 indexOf 用于查找 id 包含 rblstPallet 的元素

【解决方案2】：

任意使用：

var rblstPallet = document.getElementById('<%=rblstPallet.ClientID=>');

或者

将客户端 ID 模式设置为静态：

<asp:RadioButtonList ID="rblstPallet" runat="server" RepeatDirection="Horizontal" ClientIDMode="static">

找到并循环遍历每个单选按钮：

var rblstPallet = document.getElementById('rblstPallet');
rblstPallet  = rblstPallet.querySelectorAll('input[type="radio"]')

【讨论】：

我无法理解最后一行..你能不能给我一个示例..我的意思是我应该在我的 js 代码中哪里使用它。
控制台错误 --> object #<nodelist> has no method 'querySelectorAll'
你使用的是哪个浏览器
在 querySelectorAll 之前使用 console.log(rblstPallet) 会得到什么
这意味着您无法获取 rblstPallet。您是否将 clientIdMode 设置为静态

【解决方案3】：

替换

var rblstPallet = document.getElementById('rblstPallet');

由

var rblstPallet = document.getElementById('<%= rblstPallet.ClientID %>');

如果您想验证您的单选按钮列表，为什么不使用验证器控件？

<asp:RequiredFieldValidator ID="rfvPallet" runat="server"
      ControlToValidate="rblstPallet" ErrorMessage="RequiredFieldValidator">
 </asp:RequiredFieldValidator>

【讨论】：

我用过这个..它不起作用..正如我在帖子中提到的那样。 :)