DevExpress MVC 网格视图答案

【问题标题】：DevExpress MVC GridviewDevExpress MVC 网格视图
【发布时间】：2019-03-10 16:01:53
【问题描述】：

大家好我正在尝试使用此代码在网格视图上添加一个额外的列。但是当我运行它时。我无法单击网格视图上的按钮。知道我做错了什么。谢谢

        settings.Columns.Add(column =>
        {
            column.FieldName = "Unbound";
            column.Caption = "Action";
            column.UnboundType = DevExpress.Data.UnboundColumnType.Object
            column.EditFormSettings.Visible = DevExpress.Utils.DefaultBoolean.True;
            column.ReadOnly = false;
            column.SetDataItemTemplateContent((c) =>
            {

                Html.DevExpress().Button(b =>
                {
                    b.Name = "btnVE" + c.KeyValue;
                    b.Text = "V/E";
                    b.ClientSideEvents.Click =
                    "function(s, e) { document.location='" + DevExpressHelper.GetUrl(new { Controller = "ViewPrincipal", Action = "EditRecord" })
                    + "?key=' + s.GetRowKey(e.visibleIndex); }";

                }).GetHtml();
            });
        });

        settings.Columns.Add("Id");
        settings.Columns.Add("Code");
        settings.Columns.Add("CompanyId");
        settings.Columns.Add("Description");
        settings.Columns.Add("ContactPerson");
        settings.Columns.Add("TelNo");
        settings.Columns.Add("Notes");

更新：我通过 Web 开发人员工具在 Web 上发现了错误，但我不知道如何修复它 Error button hover

【问题讨论】：

浏览器控制台是否出错？我怀疑你在s.GetRowKey(e.visibleIndex) 中使用了错误的发件人，发件人是按钮对象，而不是MVCxGridView。
@TetsuyaYamamoto...嗯..我什至无法触发代码。网格视图不允许我单击添加的按钮。我不知道什么代码可以让我点击按钮。

标签： c# asp.net-mvc gridview devexpress devexpress-mvc

【解决方案1】：

听起来问题源于s，它分配给此块上的按钮发送者而不是GridView 行：

Html.DevExpress().Button(b =>
{
    b.Name = "btnVE" + c.KeyValue;
    b.Text = "V/E";
    b.ClientSideEvents.Click =
    "function(s, e) { document.location='" + DevExpressHelper.GetUrl(new { Controller = "ViewPrincipal", Action = "EditRecord" })
    + "?key=' + s.GetRowKey(e.visibleIndex); }"; // ==> 's' refers to button object as sender
}).GetHtml();

你应该使用GridViewDataItemTemplateContainer对象来获取对应行的KeyValue属性，它从GridViewBaseRowTemplateContainer返回整数值：

column.SetDataItemTemplateContent((c) =>
{
    Html.DevExpress().Button(b =>
    {
        b.Name = "btnVE" + c.KeyValue;
        b.Text = "V/E";
        b.UseSubmitBehavior = false; // prevent default submit action
        b.EnableClientSideAPI = true; // add this line if not sure
        b.ClientSideEvents.Click =
        "function(s, e) { window.location = '" + DevExpressHelper.GetUrl(new { Controller = "ViewPrincipal", Action = "EditRecord" })
        + "?key=" + c.KeyValue.ToString() + "'; }";

    }).GetHtml();
});

或者使用更容易阅读的string.Format()：

b.ClientSideEvents.Click = string.Format("function(s, e) {{ window.location = '{0}?key={1}'; }}", 
                           DevExpressHelper.GetUrl(new { Controller = "ViewPrincipal", Action = "EditRecord" }), 
                           c.KeyValue.ToString());

注意事项：

1) 如果要获取行索引，请使用c.VisibleIndex。

2) 对于跨浏览器的考虑，我更喜欢window.location 而不是document.location 提供的here。

【讨论】：

我的主要帖子有一些更新。可以看看吗？
提供的 JS 错误似乎被截断了。请以文本而不是图像的形式提供错误。另请阅读 this reference 以了解 jQuery 捆绑。
找到了答案。你的回答帮助我意识到一些事情。谢谢
当我使用你的代码时，这给了我一个错误参数字典包含方法'System.Web.Mvc.ActionResult'的不可空类型'System.Int32'的参数'id'的空条目'WMS_Web.Controllers.FileMaintenance.ViewPrincipalController' 中的 EditRecord(Int32)'。可选参数必须是引用类型、可空类型或声明为可选参数。参数名称：参数
在哪部分代码抛出错误，你能显示EditRecord方法定义吗？听起来您有 EditRecord 函数的 id 参数，但您传递的参数名称不同。

【解决方案2】：

发现问题。显然，这应该在创建网格视图之前放在视图的前面。但我在想这应该是一个 JScript。它应该异步运行。哦，只要它有效。感谢@tetsuya的帮助

 @Html.DevExpress().GetStyleSheets(
        new StyleSheet { ExtensionSuite = ExtensionSuite.NavigationAndLayout },
        new StyleSheet { ExtensionSuite = ExtensionSuite.Editors, ExtensionType = ExtensionType.Button },
        new StyleSheet { ExtensionSuite = ExtensionSuite.GridView }

    )
    @Html.DevExpress().GetScripts(
        new Script { ExtensionSuite = ExtensionSuite.NavigationAndLayout },
        new Script { ExtensionSuite = ExtensionSuite.Editors, ExtensionType = ExtensionType.Button },
        new Script { ExtensionSuite = ExtensionSuite.GridView }
    )

【讨论】：