jQuery datatables actionlink如何添加 [英] jquery datatables actionlink how to add

问题描述

过去的几个小时我一直在搜索，但不幸的是，我似乎找不到如何使用.net和MVC通过操作编辑和删除链接列填充数据表的示例.

I have been searching for the last few hours, and unfortunately I cannot seem to find an example of how to populate a datatable with an action edit and delete link column using .net and MVC.

这是我到目前为止的内容，如何添加动作链接?我想念什么?

Here is what I have so far, how do I add an action link? What am I missing?

<script type="text/javascript">
$(document).ready(function () {
    $('#myDataTable').dataTable({
        bProcessing: true,
        sAjaxSource: '@Url.Action("Index1", "Default1")'
    });

});
</script>

<div id="container">
<div id="demo">
    <table id="myDataTable">
        <thead>
            <tr>
                <th>
                    RoleId
                </th>
                <th>
                    RoleName
                </th>
                <th>
                    UserId
                </th>
                <th>
                    UserName
                </th>
            </tr>
        </thead>
        <tbody> 
        </tbody>
</table>    
</div>
</div>

我想在最后一列中添加它；

I want to add this in the last column;

    <td>
        @Html.ActionLink("Edit", "Edit", new {id=item.PrimaryKey}) |
        @Html.ActionLink("Details", "Details", new { id=item.PrimaryKey }) |
        @Html.ActionLink("Delete", "Delete", new { id=item.PrimaryKey })
    </td>

但无法弄清楚该怎么做.

But cannot figure out how to do it.

推荐答案

您可以将 aoColumns 属性与 fnRender 函数一起使用以添加自定义列.您不能使用 Html.ActionLink 帮助器，因为必须从javascript动态生成链接. aoColumns 属性可帮助您配置每列，如果您不想配置特定的列，只需传递 null ，否则您必须传递 object({}).

You could use the aoColumns property with fnRender function to add custom columns. You can't use the Html.ActionLink helper because you have to generate the links dynamically from the javascript. The aoColumns property helps you to configure each columns, if you don't want to configure a particular column just pass null else you have to pass an object({}).

fnRender 函数可帮助您使用其他列的值创建链接.您可以使用 oObj.aData 来获取另一列的值，例如 id 来生成链接.

The fnRender function helps you to create the links using the values of the other columns. You can use the oObj.aData to get the values of the other column like id to generate the links.

<script type="text/javascript">    
    $(document).ready(function () {
        $('#myDataTable').dataTable({
            bProcessing: true,         
            sAjaxSource: '@Url.Action("Index1", "Default1")',
            aoColumns: [
                      null, // first column (RoleId)
                      null, // second column (RoleName)  
                      null, // third (UserId)
                      null, // fourth (UserName)

                      {     // fifth column (Edit link)
                        "sName": "RoleId",
                        "bSearchable": false,
                        "bSortable": false,
                        "fnRender": function (oObj)                              
                        {
                            // oObj.aData[0] returns the RoleId
                            return "<a href='/Edit?id=" 
                                + oObj.aData[0] + "'>Edit</a>";
                        }
                       },

                       { }, // repeat the samething for the details link

                       { }  // repeat the samething for the delete link as well

                   ]
     });  
}); 
</script>

从服务器返回的JSON输出中的另一件重要事情，对于edit列，还必须返回类似1、2、3之类的东西.

Another important thing in the JSON output you return from the server, for the edit column also you have to return something like 1, 2, 3 or anything.

参考: http://jquery-datatables-editable.googlecode.com/svn/trunk/ajax-inlinebuttons.html

这篇关于jQuery datatables actionlink如何添加的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！