使用ASP .NET MVC编辑Kendo UI网格时重定向

问题描述：

当我单击带有带有ASP .NET MVC的Kendo UI网格的编辑"按钮时，我想向其他页面添加重定向.

I want to add a redirection to another page when I click on the "Edit" button with a Kendo UI grid with ASP .NET MVC.

这是基本代码:

@(Html.Kendo().Grid<ViewModel>()
    .Name("grid")
    .Columns(columns =>
    {
        columns.Bound(x => x.Id);
        columns.Bound(x => x.Name);
        columns.Bound(x => x.Field1);
        columns.Command(commands =>
        {
            commands.Edit();
            commands.Destroy();
        })
    })
    .DataSource(dataSource => dataSource
        .Ajax()
        .Model(model => model.Id(x => x.Id))
        .Read(read => read.Action("Read", "Home"))
        .Update(update => update.Action("Edit", "Home"))
        .Destroy(destroy => destroy.Action("Destroy", "Home"))
    )
)

我尝试使用HTML属性，但是它不起作用:

I tried to use the HTML attributes but it doesn't work:

commands.Edit().HtmlAttributes(new { @class = "edit" });

然后，我尝试添加一个自定义编辑(通过commands.Custom(...)，但不幸的是，它仅用于.Server()数据绑定.

Then, I tried to add a custom edit (via commands.Custom(...) but unfortunately it is just for .Server() data binding.

我可以使用客户端模板来做到这一点，但我真的很想使用Kendo UI提议的默认按钮:

I can do it with a client template but I really would like to use the default button proposed by Kendo UI:

columns.Template(@<text></text>)
            .ClientTemplate(
                "<a href='" + Url.Action("Edit", "Home") + "/#=Id#'>Edit</a>");

您还有其他想法吗?

谢谢.

答

即使使用Ajax数据源，您也应该能够使用自定义命令.我只是使用以下代码在本地进行了测试，以确保它仍然可以正常工作.

You should be able to use custom commands, even with an Ajax datasource. I just tested this locally with the following code to make sure it will still work.

视图中的代码:

<script type="text/javascript">
    function redirectTest(e) {
        e.preventDefault();

        var dataItem = this.dataItem($(e.currentTarget).closest("tr"));
        alert(dataItem.Name);
    }
</script>

@(Html.Kendo().Grid<ViewModel>()
.Name("testing")
.Columns(columns => 
    {
      columns.Bound(x => x.Id);
      columns.Bound(x => x.Name);
      columns.Command(command => command.Custom("Edit").Click("redirectTest"));
    })
.DataSource(dataSource => dataSource
    .Ajax()
    .Read(read => read.Action("ReadAction", "ControllerName"))
)
)

来源:自定义命令演示

使用ASP .NET MVC编辑Kendo UI网格时重定向

相关推荐