使用Ajax的json回调元素来选中已操作的复选框

Manipulated checkbox to checked using element of json callback from Ajax

本文关键字:操作 复选框 元素 Ajax json 回调 使用      更新时间:2023-09-26

我在jquery中使用ajax来获得如下数据:

$.ajax({
          url : "<?=  base_url('surveyor/c_surveyor_inspection/get_data_untuk_inspection_surveyor_dua'); ?>",
          type : "POST",
          data : {
              ID : id
          },
          dataType :'json',
          success : function(response){
              console.log(response);
          }
      });

基于这个ajax,我得到了这样的JSON:

{
"header ": [{
    "NO_INSPECTION": "55",
    "ID_CONDITION": "1",
    "NAMA_CONDITION": "DIRTY"
}, {
    "NO_INSPECTION": "55",
    "ID_CONDITION": "2",
    "NAMA_CONDITION": "DAMAGE"
}],
"transaction": [{
    "NO_INSPECTION": "55",
    "ID_ITEM_INSPECTION": "1",
    "NOMOR_ITEM_INSPECTION": "1",
    "NAMA_ITEM_INSPECTION": "Protection Box Cover",
    "CONDITION": "9",
    "ALIAS": "BE",
    "NAME_ITEM": "BENT"
}, {
    "NO_INSPECTION": "55",
    "ID_ITEM_INSPECTION": "2",
    "NOMOR_ITEM_INSPECTION": "2a",
    "NAMA_ITEM_INSPECTION": "Manhole LID, Fastening Bolts",
    "CONDITION": "7",
    "ALIAS": "B",
    "NAME_ITEM": "BROKEN"
}]

}

请在第一个元素og中看到这个名为header的json有了这个元素,我想操作像这样的html复选框

<div class="col-sm-12">
  <label class="checkbox-inline">
     <input type="checkbox" value="1" checked="checked" name="condition[]">Dirty
  </label>
  <label class="checkbox-inline">
     <input type="checkbox" value="2" name="condition[]">Damage
  </label>
  <label class="checkbox-inline">
     <input type="checkbox" value="3" name="condition[]">Clean
  </label>
  <label class="checkbox-inline">
     <input type="checkbox" value="4" name="condition[]">Off Hire
  </label>
</div>

我应该怎么做才能成功ajax?也就是说,在JSON中,我得到了值和项"1''DIRTY''2''DAMAGE'",这意味着它将在html中被检查。感谢您的帮助。非常感谢

您可以这样做:

var i;
// uncheck all checkboxes
$('input[type=checkbox]').prop('checked', false);
// check appropriate checkboxes
for (i = 0; i < response.header.length; i = i + 1) {
  $('input[type=checkbox][value=' + response.header[i].ID_CONDITION + ']').prop('checked', true);
}