使用 ajax 显示搜索结果

Question

请帮忙，我有我用ajax加载的数据，但是我很困惑，当我输入项目代码时，json表格中生成的数据如何进入表格

看法

<div class="form-group col-md-4">
   <label for="field-1" class="control-label">KODE RUNSHEET</label>
   <input name="kd_runsheet[]" class="form-control" id="kode" type="text" placeholder="Masukan Kode Runsheet" style="" required="">
   <input name="id_runsheet" id="id_runsheet" class="form-control" type="hidden" style="">    
</div>

搜索后我想在表格中输入 json 结果

<table class="table table-bordered" style="width: 100%; cellspacing: 0;">
     <thead>
         <tr>
         <th>Kode Outbound</th>
         <th>Kode Resi</th>
         </tr>
     </thead>
     <tbody id="isinya">

     </tbody>
  </table>

// search by ajax
 $(document).ready(function(){
     $('#kode').on('input',function(){
        var kode=$(this).val();
        $.ajax({
            type : "POST",
            url  : "<?php echo base_url('backend/history_status/caris')?>",
            dataType : "JSON",
            data : {kd_runsheet: kode},
            cache:false,
            success: function(data) {
            jmlData = data.length;
            tampung = "";
            for (a = 0; a < jmlData; a++) {
                tampung += "<tr>" +
                    "<td>" + (a + 1) + "</td>" +
                    "<td>" + data[a]["kd_runsheet"] + "</td>" +
                    "<tr/>";
            }
            $("tbody")[0].innerHTML += tampung;
            }
            });
    return false;
   });
});

结果 Json

[
  {"id_runsheet":"6","kd_runsheet":"RUNSHEET-0000-0003"},
  {"id_runsheet":"6","kd_runsheet":"RUNSHEET-0000-0003"}
]

Model

 public function caridb($kode){
  $query = $this->db->query("SELECT runsheet.id_runsheet,kd_runsheet FROM runsheet 
  INNER JOIN runsheet_detail ON runsheet.id_runsheet=runsheet_detail.id_runsheet WHERE kd_runsheet ='$kode'");
  return $query->result();
}

Controller

public function caris(){  
$id=$this->input->post('kd_runsheet');
$data=$this->M_history_status->caridb($id);
echo json_encode($data);
}

Answer 1

尝试这样的事情。 您的标记应该在循环内。

success: function(data){
    var markup = "<tr>
                   <td><input type='text'></td>
                  </tr>";
    $("#isinya").append(markup);
}

Answer 2

你得到 JSON 对象的数组

使用循环分隔每个 JSON Object 并将其添加到表中：

success: function(data){
    for(i=0;i<data.length;i++){
        var row="<tr><td>"+data[i].id_runsheet+"</td><td>"+data[i].kd_runsheet+"</td></tr>";
        $("#isinya").append(row); //Adding rows in <tbody>
    }
}