将数组数据获取到表-jquery中
Get Array data into table - jquery
一个asp:DataList生成了以下html。一个问答;表格,每组都有问题、问题和选项。
//Repeating Set
<table id="tblQuestions" class="tblQuestions">
<tr><td><span class="lbQno">1</span><span>First question</span></td></tr>
<tr>
<td>
<table class="clOptions">
<tr>
<td><input type="radio" value="1/><label>sometext</label</td>
<td><input type="radio" value="2/><label>sometext</label</td>
<td><input type="radio" value="3/><label>sometext</label</td>
</tr>
</table>
</td>
</tr>
</table>
点击按钮,我想检查是否所有问题都得到了回答。
JS:
//Get the questionslist
//Loop thro' them, assigning each list to a table.
// and then get the Qno and optionslist in that table
var QuestionsList = document.getElementsByClassName("tblQuestions");
function AllQuestionsAnswered() {
for(var i = 0;i<QuestionsList.length;i++)
{
var tbl = QuestionsList[i];
var OptionsList = $('tbl.clOptions input:radio');
$('tbl tr').each(function () {
var QuestionNo = $(this).find('.lbQno').text();
if(QuestionId > 0){
//perform check on each radiobutton of question
}
});
}
}
我在如何控制方面失败了。for循环中的所有3个定义都不起作用。我该如何继续。
让我们假设您可以更正HTML:的所有问题
input
的值中缺少"
input
s缺少name
</label>
缺少>
然后,您可以使用此代码检查所有必要的问题。
- 筛选所有应检查的问题(基于
.lbQno
文本) - 对于每个筛选的问题:
- 获取当前问题所选单选按钮的长度
- 如果没有选择单选按钮(
length
等于0
),则显示错误并停止检查
JavaScript:
$(document).ready(function()
{
function filterElement()
{
return parseInt($(this).find(".lbQno").text()) > 0;
}
$('#check').click(function()
{
$(".tblQuestions").filter(filterElement).each(function()
{
var checkedCount = $(this).find('.clOptions input:radio:checked').length;
if (!checkedCount)
{
alert($(this).find(".lbQno").next().text() + " is not answered");
return false;
}
});
});
});
Fiddle。
相关HTML:
<table id="tblQuestions1" class="tblQuestions">
<tr><td><span class="lbQno">1</span><span>First question</span></td></tr>
<tr>
<td>
<table class="clOptions">
<tr>
<td><input type="radio" name="q1" value="1"/><label>sometext</label></td>
<td><input type="radio" name="q1" value="2"/><label>sometext</label></td>
<td><input type="radio" name="q1" value="3"/><label>sometext</label></td>
</tr>
</table>
</td>
</tr>
</table>
<table id="tblQuestions2" class="tblQuestions">
<tr><td><span class="lbQno">1</span><span>Second question</span></td></tr>
<tr>
<td>
<table class="clOptions">
<tr>
<td><input type="radio" name="q2" value="1"/><label>sometext</label></td>
<td><input type="radio" name="q2" value="2"/><label>sometext</label></td>
<td><input type="radio" name="q2" value="3"/><label>sometext</label></td>
</tr>
</table>
</td>
</tr>
</table>
<table id="tblQuestions3" class="tblQuestions">
<tr><td><span class="lbQno">0</span><span>Unnecessary question</span></td></tr>
<tr>
<td>
<table class="clOptions">
<tr>
<td><input type="radio" name="q0" value="1"/><label>sometext</label></td>
<td><input type="radio" name="q0" value="2"/><label>sometext</label></td>
<td><input type="radio" name="q0" value="3"/><label>sometext</label></td>
</tr>
</table>
</td>
</tr>
</table>
<input id="check" type="button" value="check"/>
相关文章:
- jQuery数组乘法
- 简单JQuery数组
- 缺陷的JQuery数组,实现不起作用
- Jquery数组-设置和加载值
- jQuery数组参数和each()
- Jquery数组查询不起作用
- 如何对jquery数组中的项执行函数
- 从 javascript 数组创建一个 Jquery 数组
- 循环JQuery数组
- 从jQuery数组或元素的对象列表中选择第N个项目
- 如何在jQuery数组中保存行的每一列的内容
- 获取jquery数组对象的第n项
- jQuery 数组迭代
- Jquery 数组通配符
- 如何从jquery数组中删除双引号
- 如何在单引号内添加每个 jquery 数组值
- 如何使用 Ajax 调用将 jQuery 数组传递到 Spring 中
- 如何将jquery数组添加到html表单中,以将复选框动态添加到对话框中
- 创建循环设置超时 jquery 数组
- 按名称查找 jquery 数组