如何修复 Uncaught SyntaxError: Unexpected token ：

Question

我尝试使用 ajax 在控制器中获取数据类型 post，我尝试直接访问导致控制器数据成功退出的链接出现/存在别名数据，但是当我尝试使用 ajax 调用时，控制台中出现错误浏览器下令UncaughtSyntaxError: Unexpected tokens:怎么处理？

通过直接网络访问成功获取的数据：

{
   "dataSparepartOffice":[
      {
         "tgl":"2019-04-16 00:00:00",
         "project":"MRTJ",
         "name":"Laptop",
         "sn":"12345",
         "qty":"5",
         "Keterangan":"Penerimaan Delivery Order"
      },
      {
         "tgl":"2019-04-16 00:00:00",
         "project":"MRTJ",
         "name":"Laptop",
         "sn":"12345",
         "qty":"1",
         "Keterangan":"Pemakaian Spare Part"
      },
      {
         "tgl":"2019-04-16 08:22:45",
         "project":"MRTJ",
         "name":"Laptop",
         "sn":"12345",
         "qty":"5",
         "Keterangan":"Request Order"
      }
   ]
}

这是我在控制器中的功能：

public function filterInOffice(){
    $sparepart = $this->input->post('sparepart');
    $data = $this->m_data->filterOffice($sparepart);
    $callback = array(
        'dataSparepartOffice' => $data,
    );
    echo json_encode($callback);
}

这是我在模型中的功能：

public function filterOffice($sparepart){
    $this->db->select('use_sparepart.tanggal as tgl , project, stock.name, use_sparepart.sn_use as sn, use_sparepart.qty_use as qty, "Pemakaian Spare Part" as Keterangan');
    $this->db->from('use_sparepart');
    $this->db->join('stock', 'stock.id_stock = use_sparepart.id_stock', 'left');
    $this->db->join('project', 'project.id_project = use_sparepart.id_project', 'left');
    $this->db->like('name', $sparepart, 'both');
    $query2 = $this->db->get_compiled_select();
    $this->db->select('delivery_order.tanggal as tgl , project, spare_part.name, delivery_order.sn_do as sn, delivery_order.qty_do as qty, "Penerimaan Delivery Order" as Keterangan');
    $this->db->from('delivery_order');
    $this->db->join('spare_part', 'spare_part.id_sparepart = delivery_order.id_sparepart', 'left');
    $this->db->join('project', 'project.id_project = delivery_order.id_project', 'left');
    $this->db->like('name', $sparepart, 'both');
    $query1 = $this->db->get_compiled_select();
    $this->db->select('request_order.created_at as tgl,  project, request_order.name, request_order.sn_ro as sn, request_order.qty_ro as qty, "Request Order" as Keterangan');
    $this->db->from('request_order');
    $this->db->join('project', 'project.id_project = request_order.id_project', 'left');
    $this->db->where('status != 0');
    $this->db->like('name', $sparepart, 'both');
    $this->db->order_by("tgl", "ASC");
    $query3 = $this->db->get_compiled_select();
    $query = $this->db->query($query1.' UNION '.$query2.' UNION '.$query3);
    return $query->result();
}

这是我的看法：

<tbody class="Office" id="show_dataaa">
   <?php if (!empty($dataSparepartOffice)) {  
     $no = 1;
      foreach($dataSparepartOffice as $key){
   ?>
   <tr>
      <td style='text-align: center'><?= $no++ ?></td>
      <td style='text-align: center'><?= $key->tgl ?></td>
      <td style='text-align: center'><?= $key->name ?></td>
      <td style='text-align: center'><?= $key->sn ?></td>
      <td style='text-align: center'><?= $key->qty ?></td>
      <td style='text-align: center'><?= $key->Keterangan ?></td>
   </tr>
   <?php } } else {?>
   <tr>
      <td style='text-align: center' colspan="6"><?= 'No Data in database' ?></td>
   </tr>
   <?php } ?></tbody>

这是我的 js：

<script>
$(document).ready(function() {
    $("#btnSubmitOffice").click(function(){
        $(this).html("SEARCHING...").attr("disabled", "disabled");
        $.ajax({
            url     : <?php echo base_url('Control/filterInOffice') ?>,
            type    : 'POST',
            data    : { sparepart : $("#sparepartInput").val() },
            dataType: 'JSON',
            beforeSend: function(e) {
                if(e && e.overrideMimeType) {
                    e.overrideMimeType("application/json;charset=UTF-8");
                }
            },
            success: function(response){
                console.log(response);
                $("#btn-btnSubmitOffice").html("SEARCH").removeAttr("disabled");
                $("#show_dataaa").html(response.hasil);
            },
            error: function (xhr, ajaxOptions, thrownError) {
                alert(xhr.responseText);
            }
        });
    });
});
</script>

我希望数据输入到我在视图中提供的表格中

Answer 1

在 ajax 请求中做一些更改

url     : "<?php echo base_url('Control/filterInOffice') ?>",
data    : { 'sparepart' : $("#sparepartInput").val() },

在success 函数中response.hasil 将是未定义的。试试这个response.dataSparepartOffice

success: function(response){
     console.log(response);
     $("#btn-btnSubmitOffice").html("SEARCH").removeAttr("disabled");
     $("#show_dataaa").html(response.dataSparepartOffice);
} 

Answer 2

url需要单/双引号，请尝试 在ajax=>success 方法中应该有response.dataSparepartOffice 来访问与response 一起出现的json，因为没有像hasil 这样的东西

<script>
$(document).ready(function() {
    $("#btnSubmitOffice").click(function(){
        $(this).html("SEARCHING...").attr("disabled", "disabled");
        $.ajax({
            url     : "<?php echo base_url('Control/filterInOffice') ?>",//changes
            type    : 'POST',
            data    : { sparepart : $("#sparepartInput").val() },
            dataType: 'JSON',
            beforeSend: function(e) {
                if(e && e.overrideMimeType) {
                    e.overrideMimeType("application/json;charset=UTF-8");
                }
            },
            success: function(response){
                console.log(response);
                $("#btn-btnSubmitOffice").html("SEARCH").removeAttr("disabled");
                $("#show_dataaa").html(response.dataSparepartOffice);//changes
            },
            error: function (xhr, ajaxOptions, thrownError) {
                alert(xhr.responseText);
            }
        });
    });
});
</script>