Json数据使用jquery datatable与表绑定

时间:2013-09-28 10:12:55

标签: jquery datatable

我从我的Web方法获取JSON数据,并希望使用DataTables将其显示在表中。我正在使用DataTables插件。现在我想添加一个带有隐藏字段的表的编辑链接,以保存要编辑的数据的ID,但我没有这样做。

 "sAjaxDataProp": "aaData",
       "aoColumns": [
            { "mDataProp": "DesignationID","bVisible"  :false },
            { "mDataProp": "DesignationName" },
            { "mDataProp": "DesignationShortName" },
            { "mDataProp": "UserName" },
            { 
                "sWidth": "20px", 
                "sDefaultContent": 
                     "<input id='EditID' type='hidden' value=''>
                      <a name='lnkDelete'>Delete</a>", 
                "bSortable": false  
            },

我应该在value部分写什么,以便它与DesignationID绑定。点击编辑后,我得到同一行的DesignationID值。

1 个答案:

答案 0 :(得分:0)

请尝试以下代码:

"sAjaxSource": "YOUR_AJAX_FILE.php",//here is your server file path
 "aoColumns": [
       { "mDataProp": "DesignationName" },
       { "mDataProp": "DesignationShortName" },
       { "mDataProp": "UserName" },
       { "mDataProp": "edit" },
       { "mDataProp": "delete" }
    ],
"aoColumnDefs": [
       { "bSortable": false, "aTargets": [ 3 ] }, 
       { "bSortable": false, "aTargets": [ 4 ] },
    ],  

HTML CODE:

<thead>
<tr>
    <th rowspan="2" width="215px">DesignationName</th>
    <th rowspan="2" width="215px">DesignationShortName</th>
    <th rowspan="2" width="100px">UserName</th>
    <th colspan="2" width="70px">Action</th>
</tr>
<tr>
    <th>Edit</th>
    <th>Delete</th>
</tr>

将以下html代码添加到数据从数据库检索的文件末尾的服务器文件中。

   $row['edit'] = "<a href='YOURFILE_NAME.php?YOUR_FIELD_ID={$row['DesignationID']}'>Edit</a>";
   $row['delete'] = "<a href='#' name='lnkDelete' id='lnkDelete'>Delete</a>";  

注意:对于删除操作,您可以使用id属性并使用jquery ajax删除记录并重绘数据表。