簡體   English   中英

jQuery數據表和可編輯-數據未顯示

[英]Jquery Datatables and Jeditable - Data is not displaying

我正在使用Jquery DataTables和jEditable。 我有一個正確的JSON響應,如下所示:

[{"country_id":"18","country":"Aruba","country_enabled":"1"},{"country_id":"19","country":"Afghanistan","country_enabled":null},{"country_id":"22","country":"Angola","country_enabled":"1"},{"country_id":"23","country":"Anguilla","country_enabled":null},{"country_id":"24","country":"\u00c5land Islands","country_enabled":null},{"country_id":"25","country":"Albania","country_enabled":null},{"country_id":"26","country":"Andorra","country_enabled":null},{"country_id":"27","country":"United Arab Emirates","country_enabled":null},{"country_id":"29","country":"Argentina","country_enabled":null},{"country_id":"30","country":"Armenia","country_enabled":null},{"country_id":"31","country":"American Samoa","country_enabled":null},{"country_id":"32","country":"Antarctica","country_enabled":null},{"country_id":"33","country":"French Southern Territories","country_enabled":null},{"country_id":"34","country":"Antigua and Barbuda","country_enabled":null},{"country_id":"35","country":"Australia","country_enabled":null},{"country_id":"36","country":"Austria","country_enabled":null},{"country_id":"37","country":"Azerbaijan","country_enabled":null},{"country_id":"38","country":"Burundi","country_enabled":null},{"country_id":"39","country":"Belgium","country_enabled":null},{"country_id":"40","country":"Benin","country_enabled":null},{"country_id":"41","country":"Bonaire, Sint Eustatius and Saba","country_enabled":null},{"country_id":"42","country":"Burkina Faso","country_enabled":null},{"country_id":"43","country":"Bangladesh","country_enabled":null},{"country_id":"44","country":"Bulgaria","country_enabled":null},{"country_id":"45","country":"zoo","country_enabled":null},{"country_id":"46","country":"Xylaphone","country_enabled":null}]

以上內容來自Chrome的開發人員工具和XHR窗口,因此,我知道響應看起來正確並且正在接收數據。

這是顯示數據的HTML:

<div class="content">
<div id="pad-wrapper" class="form-page">
    <div class="row">
        <div class="col-md-12">
            <h2>List of Countries</h2>
        </div>
        <div class="bs-example">
            </br>
            <form>
<div align = "left">
                <button type="button" class="btn btn-success" onclick="window.location='<?php echo site_url("admin/country_add");?>'">
                    <span class="glyphicon glyphicon-plus" aria-hidden="true"></span> Add Country
                </button>
                <button type="button" class="btn btn-danger" onclick="window.location='<?php echo site_url("admin/country_delete");?>'">
                    <span class="glyphicon glyphicon-minus" aria-hidden="true"></span> Delete Countries
                </button>
            </div>

            <!-- start table listing -->
     <table id="myDataTable">
    <thead>
        <tr>
            <th>country_id</th>
            <th>country</th>
            <th>country_enabled</th>
    </thead>

    <tbody>         
    </tbody>

</table>
<button id="btnAddNewRow">Add</button>
<button id="btnDeleteRow">Delete</button>
        </div>
    </div>
</div>

數據表出現在視圖中,但僅顯示“正在加載...”,並且從未顯示任何數據。

我已將列標題重命名為與數據庫相同的名稱,但是它仍然不顯示數據。

控制台中有一個錯誤,如下所示: 在此處輸入圖片說明

在客戶端處理模式下,通過Ajax提供的數據應具有以下結構,有關更多詳細信息,請參見ajax選項。

{
    "data": [
        // row 1 data source,
        // row 2 data source,
        // etc
    ]
}

解決方案是將JSON數據更正為:

{ 
    "data": [
        {"country_id":"18","country":"Aruba","country_enabled":"1"}
    ]
}

替代解決方案是將ajax.dataSrc設置為空字符串以指示您將返回純數組,請參見下面的示例代碼:

$('#example').dataTable({
  "ajax": {
    "url": "data.json",
    "dataSrc": ""
  }
});

暫無
暫無

聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.

 
粵ICP備18138465號  © 2020-2024 STACKOOM.COM