Kendo UI网格编辑弹出窗口未触发

时间:2015-02-02 17:44:16

标签: .net asp.net-mvc-4 kendo-grid kendo-asp.net-mvc

我无法启动“编辑”弹出窗口。调试应用程序时,我没有看到任何事件发生。我的添加用户功能非常有效。我相信我已经正确地初始化了一切 - 有人看到我做错了什么或为什么它没有正确初始化?

为什么会这样?

@(Html.Kendo().Grid<Areas.Admin.ViewModels.UserManagement.UserManagementVM>()
            .Name("UserProfileGrid")
            .Resizable(c => c.Columns(true))
            .Selectable()
            .Filterable()
            .Groupable()
         .ToolBar(toolbar =>
                {
                    toolbar.Template(@<text>


                        <input id="ButtonAddUser" type="button" class='k-button k-grid-add' value="Add User"/>
                        <input id="ButtonEditUser" type="button" class="k-button k-grid-edit" value="Edit user" />

                    @(Html.Kendo().Button()
                    .Name("ButtonRefreshPage")
                    .HtmlAttributes(new { type = "k-button" })
                    .Icon("history")
                    .Content("Refresh Page")
                    .Events(x => x.Click("RefreshPage")))

                    @(Html.Kendo().Button()
                    .Name("ButtonDeleteUser")
                    .HtmlAttributes(new { type = "k-button" })
                    .Icon("history")
                    .Content("Delete a user")
                    .Events(x => x.Click("DeleteUser")))

                    @(Html.Kendo().Button()
                    .Name("ButtonAbout")
                    .HtmlAttributes(new { type = "k-button" })
                    .Icon("history")
                    .Content("About")
                    .Events(x => x.Click("aboutButtonClick")))
                    </text>);
                })

                .Editable(editable => editable.Mode(GridEditMode.PopUp)
                )

                .Columns(columns =>
                {
                    //columns.Bound(e => e.UserOrg).Width(25).Title("User Organization");
                    columns.Bound(e => e.IsApproved).Width(50).Title("Approved Status");
                    columns.Bound(e => e.UserName).Width(150).Title("User Name");
                    //columns.Bound(e => e.user).Width(150);
                    columns.Bound(e => e.EmailAddress).Width(150).Title("Email Address");
                })

                .Sortable()
                .Scrollable()
                .Pageable()
                .Filterable()
                .Selectable()
                .Events(e =>
                {
                  e.Change("packageRowSelectionChanged");
                })
                .DataSource(dataSource => dataSource
                .Ajax()
                .PageSize(20)
                .Events(E => E.Error("error_handler"))
                .Model(model => model.Id(e => e.UserId))
                .Read(read => read.Action("ReadUsers", "UserManagement"))
                .Create(create => create.Action("UserProfileCreator", "UserManagement"))
                .Update(update => update.Action("UserProfileCreator", "UserManagement"))
                .Destroy(destroy => destroy.Action("EditingPopUp_Destroy", "UserManagement"))
                ))

2 个答案:

答案 0 :(得分:0)

两个解决方法:

答:您可以创建一个按钮并将其链接到另一个(隐藏按钮),该按钮将调用(本机)编辑功能,或者使用editRow命令,如下所示:

&#13;
&#13;
 function startEditUser() {

        var grid = $("#UserProfileGrid").data("kendoGrid");

        var selectedRow = grid.select();
        grid.editRow(selectedRow);
&#13;
&#13;
&#13;

我希望这可以帮助别人!

答案 1 :(得分:0)

您的列中没有编辑命令。当然,这就是编辑功能不起作用的原因。您无法将“编辑”和“删除”命令添加到工具栏。将命令添加到网格中的“列”部分,如下所示:

.Columns(columns =>
{
    //columns.Bound(e => e.UserOrg).Width(25).Title("User Organization");
    columns.Bound(e => e.IsApproved).Width(50).Title("Approved Status");
    columns.Bound(e => e.UserName).Width(150).Title("User Name");
    //columns.Bound(e => e.user).Width(150);
    columns.Bound(e => e.EmailAddress).Width(150).Title("Email Address");
    columns.Command(command => { command.Edit(); command.Destroy(); });
})