代码之家 › 专栏 › 技术社区 › KamalF

Kendo网格删除按钮传递行的详细信息

delete-row kendo-grid kendo-ui button asp.net-mvc

KamalF · 技术社区 · 9 年前

我有一个kendo网格,我想在其中形成delete按钮,将行的详细信息传递给控制器(就像我使用mvc一样)。然后,我将使用这些详细信息从数据库中删除该行。

我在kendo网站上搜索,找到了删除或销毁调用的部分,但我不知道如何将行的这些细节传递给控制器。

@(Html.Kendo().Grid<Kendo.Mvc.Examples.Models.ProductViewModel>()    
.Name("Grid")    
.Columns(columns => {        
    columns.Bound(p => p.ProductName);
    columns.Bound(p => p.UnitPrice).Width(140);
    columns.Bound(p => p.UnitsInStock).Width(140);
    columns.Bound(p => p.Discontinued).Width(100);
    columns.Command(command => command.Destroy()).Width(110);
})
.ToolBar(toolbar => {
    toolbar.Create();
    toolbar.Save();        
})
.Editable(editable => editable.Mode(GridEditMode.InCell))
.Pageable()
.Navigatable()
.Sortable()
.Scrollable()
.DataSource(dataSource => dataSource        
    .Ajax()         
    .Batch(true)
    .PageSize(20)
    .ServerOperation(false)                
    .Events(events => events.Error("error_handler"))
    .Model(model => model.Id(p => p.ProductID))
    .Create("Editing_Create", "Grid")
    .Read("Editing_Read", "Grid")
    .Update("Editing_Update", "Grid")
    .Destroy("Editing_Destroy", "Grid")
)
)

我的网格:

<div id="grid">

   @(Html.Kendo().Grid<dynamic>()
.Name("BrowseGrid")
.Columns(columns =>
{
    foreach (System.Data.DataColumn c in Model.Grid.Columns)
    {
        columns.Bound(c.ColumnName).EditorTemplateName("String");

    }
    columns.Command(command =>
    {
        command.Destroy();
        command.Custom("").Text("editteam").HtmlAttributes(new { id = "editteam", onClick = "editRow()" });

    });
})

.Scrollable()
.DataSource(dataSource => dataSource
    .Ajax()
    .Events(events => events.Error("error_handler"))
    .Model(model =>
    {
        //Define the model
        foreach (System.Data.DataColumn column in Model.Grid.Columns)
        {
            model.Field(column.ColumnName, column.DataType);
            model.Id("Id");
        }
    })
    .Read(read =>

        read.Action("BrowseGrid", "Configuration")
    )
    .Destroy( update => update.Action("Delete", "Configuration"))

    //Data("{nodeID:"+@Model.nodeID+"}"
)

        .Pageable(pageable => pageable
             .Refresh(true)

        .PageSizes(new int[] { 10, 100, 1000, 10000, 100000, 1000000 })
        .ButtonCount(10)
    )
  )

2 回复 | 直到 9 年前

chiapa 9 年前

请更改为:

.Destroy(update => update.Action("Process_Destroy", "controller name"))

并且在控制器中,

[AcceptVerbs(HttpVerbs.Post)]
public ActionResult Process_Destroy([DataSourceRequest] DataSourceRequest request, ProductViewModel product)
{
    if (product != null)
    {
        //write your code for delete action;
    }

    return Json(ModelState.ToDataSourceResult());
}

这会奏效的。

chiapa 9 年前

我假设您只需要行的id就可以删除它,但我认为您可以发送所选行的完整模型。我将两者都发送。

这样地:

.Destroy(d => d.Action("controllerMethod", "controllerName").Data("jsFunction"))

在javascript中:

function jsFunction() {
    var grid = $("#BrowseGrid").data("kendoGrid");
    var id = grid.dataItem(grid.select()).Id;
    return {
        id: id
    };
}

控制器方法应接收参数:

public ActionResult controllerMethod(string id)