Question

我是Laravel的新手，我想开始使用Bootstrap Modal。我正在使用库DataTables并围绕它构建Update函数，但是出现此错误：

Uncaught TypeError: Cannot set property '_DT_CellIndex' of undefined
    at Ha (jquery.dataTables.min.js:24)
    at O (jquery.dataTables.min.js:16)
    at HTMLTableRowElement.<anonymous> (jquery.dataTables.min.js:17)
    at app.js:1
    at Function.map (app.js:1)
    at E.fn.init.map (app.js:1)
    at na (jquery.dataTables.min.js:16)
    at e (jquery.dataTables.min.js:92)
    at HTMLTableElement.<anonymous> (jquery.dataTables.min.js:93)
    at Function.each (app.js:1)

这是我的表格代码：

<div class="container">
  <table id="tabladedatos" class="table">
<thead class="thead-dark">
<tr>
  <th>ID</th>
  <th>First name</th>
  <th>Last name</th>
  <th>Address</th>
  <th>Mobile</th>
  <th>Action</th>
</tr>
</thead>
<tbody>
<tr>
  @foreach($emps as $emp)
    <tr>
      <td> {{$emp->id}} </td>
      <td> {{$emp->fname}} </td>
      <td> {{$emp->lname}} </td>
      <td> {{$emp->address}} </td>
      <td> {{$emp->mobile}} </td>
      <td>
        <a class="btn btn-success edit">Update</a>
        <a class="btn btn-danger">Delete</a>
      </td>
    </tr>
  @endforeach
</tr>
</tbody>
</table>
</div>

这是我正在使用DataTables的JS函数：

<script type="text/javascript">

  $(document).ready(function(){

    var table = $('#tabladedatos').DataTable();

    //Edit Record
    table.on('click','.edit',function(){
      $tr = $(this).closest('tr');
      if($($tr).hasClass('child')){
        $tr = $tr.prev('.parent');
      }

      var data = table.row($tr).data();
      console.log(data);

      $('#fname').val(data[1]);
      $('#lname').val(data[2]);
      $('#address').val(data[3]);
      $('#mobile').val(data[4]);

      $('#editForm').attr('action', '/employee/'+data[0]);
      $('#editModal').modal('show');
    });


  });
</script>

我已经看到这个错误通常是由th和td的数量不匹配引起的，但是我看不到这段代码中的不匹配。请帮帮我！

Answer 1

您应该在foreach块之前和之后删除<tr>标签。

<tbody>
  @foreach($emps as $emp)
    <tr>
      <td> {{$emp->id}} </td>
      <td> {{$emp->fname}} </td>
      <td> {{$emp->lname}} </td>
      <td> {{$emp->address}} </td>
      <td> {{$emp->mobile}} </td>
      <td>
        <a class="btn btn-success edit">Update</a>
        <a class="btn btn-danger">Delete</a>
      </td>
    </tr>
  @endforeach
</tbody>

如何解决：“未捕获的TypeError：无法设置未定义的属性'_DT_CellIndex'”

1 个答案: