Javascript Jquery复选框选择迭代
我必须使用Javascript Jquery复选框选择迭代,javascript,jquery,json,Javascript,Jquery,Json,我必须使用data.tarifTypeOptionList[0]，这样它会返回值，但看起来迭代不起作用，只返回第一个值，即： { "id": 1, "code": "0001", "libelle": "TARIF PUBLIC", "montantTarifDefaut": 10.00, "tarifTypeList": [ { "chambreTypeId": 1, "tarifTypeId": 1 } ], "tarifT
data.tarifTypeOptionList[0]{
"id": 1,
"code": "0001",
"libelle": "TARIF PUBLIC",
"montantTarifDefaut": 10.00,
"tarifTypeList": [
{
"chambreTypeId": 1,
"tarifTypeId": 1
}
],
"tarifTypeOptionList": [
{
"typeTarifId": 1,
"tarifOptionId": 1
},
{
"typeTarifId": 1,
"tarifOptionId": 2
},
{
"typeTarifId": 1,
"tarifOptionId": 3
}
]
}
{
“typeTarifId”：1，
“tarifOptionId”：1
},
${option_tarif.libelle}
{
"typeTarifId": 1,
"tarifOptionId": 1
},
<form class="form-horizontal" style="margin: 0 auto; width: 150px;" id="scrollit" name="thisForm">
<c:forEach items="${option_tarif_list}" var="option_tarif" varStatus="loop">
<div class="checkbox1">
<label>
<input type="checkbox" name="tarif_inclue" value="${option_tarif.libelle}" class="checkboxchk" id="option_tarif_chk_${option_tarif.id}">
${option_tarif.libelle}
</label>
</div>
</c:forEach>
<!-- <input type="button" value="Submit" onclick="loopForm(document.thisForm);">
<div id="cbResults"></div>-->
</form>
笔名
代码
平价大奖赛
${type_tarif.libelle}
${type_tarif.code}
${type_tarif.montanttarifdeaut}
.each（）谢谢。尝试使用数据。tarifTypeOptionList[i]已插入使用数据。tarifTypeOptionList[0]
$（'input[type=“checkbox”]”）。每个（函数（i）{
$（“#option_tarif_chk”+data.tarifTypeOptionList[i].tarifOptionId.prop（'checked'，true））；
});$（'input[type=“checkbox”]”）复选框，而不是尝试遍历tarifTypeOptionList
，因此它将为您提供当前对象，通过使用相同的方法，我们可以设置checked
属性true
<table class="table tg" style="table-layout: fixed; width: 745px">
<colgroup>
<col style="width: 249px">
<col style="width: 249px">
<col style="width: 249px">
</colgroup>
<thead>
<tr>
<th class="tg-s6z2 bdleft">NOM</th>
<th class="tg-s6z2">CODE</th>
<th class="tg-s6z2">PRIX PAR DEFAUT</th>
</tr>
</thead>
<tfoot>
</tfoot>
<tbody>
<tr>
<td colspan="5">
<div class="scrollit">
<table class="table tg" style="table-layout: fixed;">
<colgroup>
<col style="width: 220px">
<col style="width: 240px">
<col style="width: 240px">
</colgroup>
<c:forEach items="${type_tarif_list}" var="type_tarif" varStatus="loop">
<tr class="data-list-row" name="data-list-row" id="${type_tarif.id}" style="cursor: pointer;">
<td class="tg-s6z2 bdleft">${type_tarif.libelle}</td>
<td class="tg-s6z2">${type_tarif.code}</td>
<td class="tg-s6z2">${type_tarif.montantTarifDefaut}</td>
<td class="deleterow bdryt" id="${type_tarif.id}" name="del_button"><div class="glyphicon glyphicon-remove" title="Supprimer"></div></td>
</tr>
</c:forEach>
</table>
</div>
</td>
</tr>
</tbody>
</table>
row.sides（）.find（“.checkboxchk”）.prop（'checked'，false）
//这将取消选中类名为“checkboxchk”的所有复选框，然后将所选行的“checked”复选框设置为true。
$（.checkboxchk”）.prop（'checked'，false）；
$.getJSON（'/ws/booking/getpriceinput_by_id/'+currentId，函数（数据）{
$（“#当前_类型tarif_id”）.val（data.id）；
$（“#inputName”）.val（data.libelle）；
$（“#inputCode”）.val（data.code）；
$（“#inputTarif”）.val（data.montanttariffeaut）；
//使用json数据检查当前行复选框
$.each（data.tarifTypeOptionList，function（i，obj）{
$（“#option_tarif_chk”+obj.tarifOptionId）.prop（'checked'，true）；
});
});
});
非常感谢您的及时回复，是的，它起作用了：）你能帮我设置一个if条件吗？这样，当我点击第二行时，从第一个id获得的结果将被取消选中，并且只显示第二个id的结果？如果你只使用单选按钮而不是复选框会怎么样？我不能，因为点击表格行后将显示各种值。而且，我应该能够从复选框中进行各种项目选择，并将其保存在JSON中。所以单选按钮不是一个选项。是的，这也可以。非常感谢你。您能帮我设置一个if条件，以便在我单击第二行时取消选中从第一个id获得的结果，并且仅显示第二个id的结果吗？@Fadil您的意思是如果单击第二行，则应取消选中上一行复选框？@Srinu。我想一个if条件可能会起作用：/我写过这样的东西：$.each（data.tarifTypeOptionList，function（i，obj）{if（$）（“#option_-tarif_-chk_”+obj.tarifOptionId）。prop（'checked'）==true）$（“#option_-tarif_-chk_”+obj.tarifOptionId）。prop（'checked'，false）；else$（“#option_tarif_chk”+obj.tarifOptionId）.prop（'checked'，true）；}）；但问题是，我需要再次单击该行以取消选中值，然后转到第二个选项this$（this）.closest（'tr'）.sides（）.find（'input[type='checkbox']））.prop（'checked'，false）；。它将取消选中同级行复选框
。注意：放置在每个循环的外部。
<table class="table tg" style="table-layout: fixed; width: 745px">
<colgroup>
<col style="width: 249px">
<col style="width: 249px">
<col style="width: 249px">
</colgroup>
<thead>
<tr>
<th class="tg-s6z2 bdleft">NOM</th>
<th class="tg-s6z2">CODE</th>
<th class="tg-s6z2">PRIX PAR DEFAUT</th>
</tr>
</thead>
<tfoot>
</tfoot>
<tbody>
<tr>
<td colspan="5">
<div class="scrollit">
<table class="table tg" style="table-layout: fixed;">
<colgroup>
<col style="width: 220px">
<col style="width: 240px">
<col style="width: 240px">
</colgroup>
<c:forEach items="${type_tarif_list}" var="type_tarif" varStatus="loop">
<tr class="data-list-row" name="data-list-row" id="${type_tarif.id}" style="cursor: pointer;">
<td class="tg-s6z2 bdleft">${type_tarif.libelle}</td>
<td class="tg-s6z2">${type_tarif.code}</td>
<td class="tg-s6z2">${type_tarif.montantTarifDefaut}</td>
<td class="deleterow bdryt" id="${type_tarif.id}" name="del_button"><div class="glyphicon glyphicon-remove" title="Supprimer"></div></td>
</tr>
</c:forEach>
</table>
</div>
</td>
</tr>
</tbody>
</table>
$('.tg tr.data-list-row[name=data-list-row]').click(function() {
var row = $(this).closest('tr'), currentId = row.attr('id');
// to uncheck the previous row checkboxes
// this will uncheck the all checkboxes with class name `checkboxchk` before setting the `checked` to true of the selected row checkboxes.
$(".checkboxchk").prop('checked', false);
$.getJSON('<%=request.getContextPath()%>/ws/booking/getpriceinput_by_id/' + currentId, function(data) {
$("#current_typetarif_id").val(data.id);
$("#inputName").val(data.libelle);
$("#inputCode").val(data.code);
$("#inputTarif").val(data.montantTarifDefaut);
// to check the current row checkboxes using json data
$.each(data.tarifTypeOptionList, function(i, obj) {
$("#option_tarif_chk_" + obj.tarifOptionId).prop('checked', true);
});
});
});