Question

我有一个ASP.NET 5 MVC应用程序。我正在使用从Datatables.net下载的JQuery Datatables来渲染我的网格。

我希望能够在网格上选择多个记录，并通过单击一个按钮来更新所有记录中的状态字段。我无法弄清楚如何通过视图将信息从javascript传递给我的MVC控制器。这是我到目前为止所做的查看代码

    <table class="display " id="ExpenseTable">
    <thead>
        <tr>
            <th></th>
            <th>
                @Html.DisplayNameFor(model => model.ApplicationUserid)
            </th>

            <th>
                @Html.DisplayNameFor(model => model.ExpenseDate)
            </th>
            ...        </tr>
        </thead>
    <tbody>
        @foreach (var item in (IEnumerable<Expense>)ViewData["Expenses"])
        {
            <tr>
                <td></td>
                <td>                   
                   @Html.DisplayFor(modelItem => item.User.FullName)
                </td>

                <td>
                    @Html.DisplayFor(modelItem => item.ExpenseDate)
                </td>

               ....            
</tr>
    }
    </tbody>
</table>
@section Scripts {

<script>
    //script is not complete
    $(document).ready(function() {

        var table = $('#ExpenseTable').DataTable({
            dom: 'Bfrtip',
            buttons: [
                       {
                           text: 'Approve All Selected Expenses',
                           action: function () {

                           }
                       }
            ],
            columnDefs: [{
            orderable: false,
            className: 'select-checkbox',
            targets:   0
        } ],

    select: {
        style:    'multiple',
        selector: 'td:first-child'
    },

    order: [[1, 'asc']],

    } );
    } );

我想在Controller中做这样的事情

  public IActionResult ApproveMany(IEnumerable<Expense> model)
        {
            foreach (var item in model)
           {
                item.Status = "Approved";
               _context.Update(item);
                _context.SaveChanges();
            }
            return RedirectToAction("StaffExpense"); ;
         }

我需要帮助的是如何获取我拥有的按钮以及何时推送按下用户在网格上选择的所有费用项目的集合，然后将该集合传递到我的控制器中以便编辑更改可以推送回数据库。

Answer 1

$('#updateButton').click(function () 
{
    console.log("Selected rows: "+ table.rows('.selected').data().length);

    var data = $.map(table.rows('.selected').data(), function (item) 
    {
        console.log(item)
        return item;
    });
    //Call your MVC Controller/API to do the update (pass data)

    addData(data);

});

function addData(data)
{
  //Add your controller name to url
  /*POST*/
  $.ajax({
    url: '/Controller/ApproveMany',
    dataType: "json",
    type: "POST",
    contentType: 'application/json; charset=utf-8',
    data: JSON.stringify(data),
    cache: false,
    success: function (result) 
    {
        alert(result);
    },
    error: function (xhr) 
    {
        alert('error');
    }
  })
}

Answer 2

此链接有助于您获得所需的解决方案

http://www.gyrocode.com/articles/jquery-datatables-checkboxes/

使用提交全部按钮将多个行数据从JQuery Datatables传递到ASP.NET 5 / MVC 6视图

2 个答案: