当行是可编辑的时,igGrid锚变得不可访问

本文关键字:igGrid 访问 编辑 | 更新日期: 2023-09-27 18:16:12

这是我的第一篇文章,如果我做错了什么,请告诉我。

我有一个igGrid是传递生成的html代码,使一个列和标签。如果行不可编辑,则此操作非常有效。我还希望能够编辑同一行中的一列。如果允许对行进行编辑,则标记不再起作用,因为在行上的任何单击都会使行进入编辑模式。是否有任何方法只允许编辑一列?我已经禁用了不想编辑的列的编辑功能,但是单击其中的任何一个仍然会将整行进入编辑模式,只有允许的列是可编辑的。

一个示例行可能看起来像:

Filename = "<a href='path/Permit/DownloadFile?permitFileID=23'>filename.txt</a>"
Note = "file notes"
Email = "email@gmail.com"
AddedTime = "2013/05/14"
PermitFileID = "23"

我希望能够编辑注释列,并且仍然能够单击文件名列。

下面是我的代码:
$(document).ready(function()
{
 $('#attachedFilesGrid').igGrid(
 {
   columns:
   [
     { headerText:"File Name", key: "FileName", dataType: "text"},
     { headerText:"Notes", key:"Note", dataType:"text"},
     { headerText:"Uploaded By", key:"Email", dataType:"text"},
     { headerText:"Date", key:"AddedTime", dataType:"date", format: "yyyy/MM/dd"},
     { headerText:"ID", key:"PermitFileID", dataType:"number"},
  ],
  width:'700px',
  dataSource: fileList,
  autoCommit:true,
  primaryKey:"PermitFileID",
  features:
[{
   name:"Updating",
   enableDeleteRow:true,
   rowDeleting:function(evt, ui)
   {
      $.post(BASEURL + "Permit/deleteFile", { "permitFileID": ui.rowID});
   },
  editRowEnded:function(evt, ui)
  {
     note = $("#attachedFilesGrid").igGrid( "getCellText", ui.rowID, "Note");
     $.post(BASEURL + "Permit/updatePermitFileNotes", { "permitFileID": ui.rowID, "note": note });
  },
  enableAddRow:false,
  editMode:"row",
  columnSettings: [
    { columnKey:"FileName", editorOptions: { disabled: true} },
    { columnKey:"Note", editorOptions: { disabled: false} },
    { columnKey:"Email", editorOptions: { disabled: true} },
    { columnKey:"AddedTime", editorOptions: { disabled: true} },
    { columnKey:"PermitFileID", editorOptions: { disabled: true} },
     ]
},

当行是可编辑的时,igGrid锚变得不可访问

我弄清楚了,editMode需要是"cell"和columnSettings这样设置:

$('#attachedFilesGrid').igGrid(
        {
            columns:
            [
                { headerText: "File Name", key: "FileName", dataType: "text"},
                { headerText: "Notes", key:"Note",  dataType:"text"},
                { headerText: "Uploaded By", key:"Email", dataType:"text" },
                { headerText: "Date", key:"AddedTime", dataType:"date", format: "yyyy/MM/dd" },
                { headerText: "ID", key:"PermitFileID", dataType:"number"},
            ],
            width: '700px',
            dataSource: fileList,
            autoCommit: true,
            primaryKey: "PermitFileID",
            features:
            [{
                name: "Updating",
                enableDeleteRow: true,
                rowDeleting: function (evt, ui)
                {
                   $.post(BASEURL + "Permit/deleteFile", { "permitFileID": ui.rowID});
                },
              editCellEnded: function (evt, ui)
                {
                   note = $("#attachedFilesGrid").igGrid( "getCellText", ui.rowID, "Note");
                   $.post(BASEURL + "Permit/updatePermitFileNotes", { "permitFileID": ui.rowID, "note": note });
                },
                enableAddRow: false,
                editMode: "cell",
                columnSettings: [
                        { columnKey: "FileName", readOnly: true },
                        { columnKey: "Note",  editorOptions: {disabled: false}},
                        { columnKey: "Email", readOnly: true },
                        { columnKey: "AddedTime", readOnly: true },
                        { columnKey: "PermitFileID", readOnly: true },
                       ]
                },
                {
                name: "Hiding",
                columnSettings: [
                    { columnKey: "FileName", allowHiding: false },
                    { columnKey: "Note", allowHiding: false },
                    { columnKey: "Email", allowHiding: false },
                    { columnKey: "AddedTime", allowHiding: false },
                    {columnKey: "PermitFileID", allowHiding: false, hidden: true}
                    ]
            }],
        });
         getFiles();