jqGrid：编辑时禁用表单字段

Question

我目前正在开发一个网络应用程序，旨在管理自动售货机等。 我决定在这个项目中使用 jQuery、jQuery UI 和 jqGrid，这样我就可以轻松提供出色且高度可定制的用户界面。
不幸的是，jqGrid 文档 已经非常过时了，而且没有涵盖这个伟大插件的所有功能（因为我真的很喜欢它，尽管文档相当糟糕）。

不管怎样，我想，足够的背景信息了。让我们进入正题：
我使用 jqGrid 内置的导航栏来添加、编辑和删除网格中的项目。
我已经让它像魅力一样工作，除了一件事：某些字段可能仅在添加新项目时启用（或可见），而不是在编辑模式下启用（它们应该隐藏和/或禁用）。

示例：
我工作的公司销售自动售货机和 有几种类型（不同 这些塔的尺寸和内容）。什么时候 一个新的塔楼被添加到一个位置并且 输入系统，类型 必须设置。但塔没有 随着时间的推移神奇地改变，所以这 以后可能无法编辑该字段。

有谁知道这种行为是否可以通过更改一些初始化参数来实现？
也许它是一个未记录的编辑选项 (editoptions) 或表单选项 (formoptions)？
或者也许您对此有一个简单的解决方案？

我很想听听您的建议/解决方案！
谢谢=）

Answer 1

您可以通过不同的方式实现您的要求。例如，在 beforeShowForm 事件内部，您可以隐藏或显示

jQuery("#list").jqGrid({
    colModel: [
        { name: 'Name', width: 200, editable: true },
   //...

}).jqGrid('navGrid','#pager', { edit: true, add: true, del: false},
          { // edit option
              beforeShowForm: function(form) { $('#tr_Name', form).hide(); }
          },
          { // add option
              beforeShowForm: function(form) { $('#tr_Name', form).show(); }
          });

id“tr_Name” 由“tr_”前缀和“Name”（来自 colModel 的列的名称属性）构造的位置。

更新：在答案和另一个显示了如何在初始化编辑之前动态更改属性的另一种方式。

更新2：免费jqGrid允许定义可编辑< /code> 作为回调函数或作为“disabled”、“hidden” 或“readonly”。请参阅wiki 文章。它允许更容易地实现相同的要求。

Answer 2

为了使字段可编辑或不可编辑，这就是我在搜索答案一段时间后结束的编码（禁用行内编辑编辑，但允许“添加”编辑）并且没有找到我需要的答案：

colModel :[ 
    {name:'id', index:'id', editable:false, ...

    }).navGrid("#pager",{edit:false,add:true,del:false,search:false,refresh:true},
        {}, // edit
        {   
            beforeInitData: function(formid) {
                $("#list").jqGrid('setColProp','id',{editable:true});
            },
            afterShowForm: function (formid) {
                $("#list").jqGrid('setColProp','id',{editable:false});
            },

Answer 3

这是一个示例：

http://www.ok-soft-gmbh.com/ jqGrid/CustomFormEdit.htm

                  beforeShowForm: function(form) {
                     $('#tr_Name', form).hide();
                  }

Answer 4

可见但不可编辑：

{ // edit option
    beforeShowForm: function(form) {
        $('#col_name', form).attr("disabled", true);
    }
}

Answer 5

这将与免费的 jqgrid 一起使用，简单明了：

这个特定的示例将只允许以“添加”形式进行编辑：

editable: function (options) {
                            // Allow edit only for "add" not for "edit"
                            if (options.mode === "addForm")
                            {
                                return true;
                            }
                            else if (options.mode === "editForm")
                            {
                                return false;
                            }
                            else
                            {
                                return false;
                            }