jquery datatable mvc項目不工作

我想生成表使用Jquery.Datatable，生成表，但沒有呈現數據，當開發人員工具打開常規錯誤出現儘管jquery &數據表引用添加到頁面爲了，所以任何幫助這裏jquery datatable mvc項目不工作

<link href="~/Content/bootstrap.css" rel="stylesheet" /> 
<link href="~/Content/jquery.dataTables.css" rel="stylesheet" /> 
<script src="~/Scripts/jquery-1.10.2.js"></script> 
<script src="~/Content/jquery.dataTables.js"></script> 


<table id="datatableId" data-url="@Url.Action("Index","Home")" cellspacing="0" width="100%" class="table table-responsive table-bordered table-striped"> 
      <thead> 
       <tr> 
        <th>First Name</th> 
        <th>Last Name</th> 
        <th>Data</th> 
        <th>Actions</th> 
       </tr> 

      </thead> 
      <tbody></tbody> 
     </table> 


<script> 
    var datatable = { 
     table: null, 
     initializedDataTable: function() { 
      var $tablea = $(".table-striped"); 
      datatable.table = $tablea.DataTable({ 
       processing: true, 
       serverSide: true, 
       "alengthMenu": [[10, 20, 30, 40, 50], [10, 20, 30, 40, 50]], 
       ajax: { 
        url: $tablea.prop("data-url"), 
        type: "POST" 
       }, 
       "columns": [{ "data": "FirstName" }, 
       { "data": "LasttName" }, 
       { "data": "Gender" }], 

       "columnDefs": [ 
        { 
         "render": function (data, type, row) { 
          var inner = '<div class="btn-group">' + 
           '<button type="button" class="btn btn-secondary dropdwon-toggle" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">' + 
           'Actions' + 
           '</button>' + 
           '<div class="dropdown-menu">' + 
           '<a href="#" class="drop-down-item btn btn-default edit" data-id="' + row.id + '" >Edit</a>' + 
           '<a href="#" class="drop-down-item btn btn-default delete" data-id="' + row.id + '" >delete</a>' + 
           '</div>' + 
           '</div>'; 

          return inner; 
         }, 
         "targets": -1 

        } 
       ], 
       "pagingType": "full_numbers" 

      }); 
      datatable.table.on('draw', function() { 
       $('button[data-type="delete"]').click(function() { 
        var $button = $(this); 

       }); 
       $('button[data-type="Edit"').click(function() { 

       }); 
      }); 


     }, 
     getData: function() { 
      if (datatable.table == null) { 
       datatable.initializedDataTable(); 

      } else { 
       datatable.table.ajax.reload(); 
      } 
     } 

    } 

    $(document).ready(function() { 
     datatable.getData(); 
    }); 
</script>

來源

2017-07-13 moath naji

你能不能請張貼其中U控制檯 –

肯定得到了錯誤，謝謝你的答覆，遺漏的類型錯誤：$ tablea.DataTable不是一個函數在Object.initializedDataTable（索引：78）在Object.getData（Index：126） at HTMLDocument。（指數：136）在火（jquery的-1.10.2.js：3062）在Object.fireWith [按resolveWith]（jQuery的1.10.2.js：3174）在功能。準備好（jquery-1.10.2.js：447） at HTMLDocument.completed（jquery-1.10.2.js：118） –

檢查你的控制檯，你沒有得到DataTable js的404錯誤或嘗試點擊數據表腳本在新選項卡中打開它。似乎文件參考中存在一些問題。 –

看來你的文件，它的路徑應該是

<script src="~/Scripts/jquery.dataTables.js"></script>

，而不是

<script src="~/Content/jquery.dataTables.js"></script>

也可以嘗試用下面的代碼

<script src="https://code.jquery.com/jquery-3.2.1.js" 
    integrity="sha256-DZAnKJ/6XZ9si04Hgrsxu/8s717jcIzLy3oi35EouyE=" 
    crossorigin="anonymous"></script> 

<script src="https://cdn.datatables.net/1.10.15/js/jquery.dataTables.min.js" />

，以取代當地的引用，因爲你正在使用jQuery的版本已經很老了。

來源

2017-07-13 07:27:57

沒有人從內容文件中拖動過！ –

jquery datatable mvc項目不工作

回答

相關問題