jqGrid 需要一个可在添加对话框而不是编辑对话框上编辑的字段

Question

我试图在我的 ASP.Net MVC 应用程序中使用 jqGrid，并且要求某些列在添加对话框中是可编辑的，但在编辑对话框中是不可编辑的。显然，这样做的方法是使用 beforeShowForm javascript 事件并在特定输入字段上设置属性。

到目前为止，我无法触发 beforeShowForm 事件。下面是我在另一个 SO question 上找到的例子但到目前为止，我还没有设法让它发挥作用。我缺少一些技巧吗？我使用的是最新的 3.8 版 jqGrid。

Controller :

 [Authorize]
 public ActionResult Index()
 {
      var gridModel = new MyGridModel();
      SetUpGrid(gridModel.MyGrid);
      return View(gridModel);
 }

 private void SetUpGrid(JQGrid grid)
 {
        grid.DataUrl = Url.Action("GridDataRequested");
        grid.EditUrl = Url.Action("EditRows");
        grid.ToolBarSettings.ShowSearchToolBar = false;

        grid.ToolBarSettings.ShowEditButton = true;
        grid.ToolBarSettings.ShowAddButton = true;
        grid.ToolBarSettings.ShowDeleteButton = true;
        grid.ToolBarSettings.ShowRefreshButton = true;
        grid.EditDialogSettings.CloseAfterEditing = true;
        grid.AddDialogSettings.CloseAfterAdding = true;

        grid.EditDialogSettings.Modal = false;
        grid.EditDialogSettings.Width = 500;
        grid.EditDialogSettings.Height = 300;

        grid.ClientSideEvents.GridInitialized = "initGrid";
 }

型号:

public class MyGridModel
{
    public JQGrid MyGrid { get; set; }

    public MyGridModel()
    {
      MyGrid = new JQGrid
      {
        Columns = new List<JQGridColumn>()
        {
            new JQGridColumn { DataField = "id", 
                               PrimaryKey = true,
                               Visible = false,
                               Editable = false },
            new JQGridColumn { DataField = "username", 
                               Editable = true,
                               EditFieldAttributes = new List<JQGridEditFieldAttribute>()
                               {
                                     new JQGridEditFieldAttribute(){ Name = "readonly", Value = "true"},
                                     new JQGridEditFieldAttribute(){ Name = "disabled", Value = "true"}
                                },
                                Width = 100},
            new JQGridColumn { DataField = "domain", 
                               Editable = true,
                               EditFieldAttributes = new List<JQGridEditFieldAttribute>()
                               {
                                    new JQGridEditFieldAttribute(){ Name = "readonly", Value = "true"},
                                    new JQGridEditFieldAttribute(){ Name = "disabled", Value = "true"}
                                },
                                Width = 100}
              }
          }
     }
}

查看:

function initGrid() {

  jQuery("#myGrid").jqGrid('navGrid','#myGrid-pager',
            { }, //options
            { // edit options
                beforeShowForm: function(frm) {
                    alert("beforeShowForm edit");
                }
            },
            { // add options
                beforeShowForm: function(frm) {
                    alert("beforeShowForm add");
                }
            },
            { }, // del options
            { } // search options
        );
}

<div>           
    <%= Html.Trirand().JQGrid(Model.MyGrid, "myGrid") %>
</div>

Answer 1

在我看来，您会找到问题的答案 here和 here (也请看示例)。

已更新:我不知道 jqGrid 的商业版本。如果您没有解决您的问题，您应该在论坛中更好地发布您的问题 http://www.trirand.net/forum/default.aspx .

如果我理解你的代码是正确的，你可以尝试从 中删除属性 readonly 和 disabled (JQGridEditFieldAttribute) 的定义编辑字段属性。相反，您可以尝试执行以下操作

如果您想在编辑对话框中显示只读字段“用户名”和“域”，您可以执行以下操作

jQuery("#myGrid").jqGrid('navGrid','#myGrid-pager',
                         { }, //options
                         { recreateForm: true, // edit options
                           beforeShowForm: function(form) {
                               $('#username',form).attr('readonly','readonly');
                               $('#domain',form).attr('readonly','readonly');
                           }
                         });

或者不使用 recreateForm: true 选项:

jQuery("#myGrid").jqGrid('navGrid','#myGrid-pager',
                         { }, //options
                         { // edit options
                           beforeShowForm: function(form) {
                               $('#username',form).attr('readonly','readonly');
                               $('#domain',form).attr('readonly','readonly');
                           }
                         },
                         { // add options
                           beforeShowForm: function(frm) {
                               $('#username',form).removeAttr('readonly');
                               $('#domain',form).removeAttr('readonly');
                           }
                         });

如果您不想在编辑对话框中显示“用户名”和“域”字段，您可以这样做

jQuery("#myGrid").jqGrid('navGrid','#myGrid-pager',
                         { }, //options
                         { recreateForm: true, // edit options
                           beforeShowForm: function(form) {
                               $('#username',form).hide();
                               $('#domain',form).hide();
                           }
                         });

它应该在 jqGrd 的免费版本中工作，但是因为你使用 SetUpGrid 来设置 jqGrid 导航栏的一些设置(比如 grid.ToolBarSettings.ShowEditButton = true ).你也用

grid.ClientSideEvents.GridInitialized = "initGrid"

我不确定您可以在 initGrid 函数中做什么。也许您应该定义一些额外的回调，而不是调用 jQuery("#myGrid").jqGrid('navGrid', ...);。看http://www.trirand.net/documentation/aspnet/_2s20v9uux.htm和 http://www.trirand.com/blog/phpjqgrid/docs/jqGrid/jqGridRender.html#methodsetNavOptions