使用锁定和未锁定列时如何找出当前正在编辑的单元格在表的哪一部分?

问题描述 投票:0回答:1

我正在使用剑道网格中的锁定和解锁列,单击单元格时会发生编辑事件。问题是因为网格被分为两部分(由于锁定列和未锁定列),所以我无法弄清楚当前编辑单元在哪个表中进行编辑...

IE:我在“名称”列中单击一个单元格,其索引为0,然后,如果在“性别”列中单击一个单元格,其索引为0。

我正在工作的网格具有比此网格更多的锁定和未锁定列。

$("#grid").kendoGrid({
  columns: [{
      field: "name",
      locked: true,
      width: 200
    },
    {
      field: "gender",
      width: 100
    },
    {
      field: "city",
      width: 100
    }
  ],
  dataSource: {
    data: [{
        id: 1,
        name: "Jane Doe",
        gender: "female",
        city: "Sofia"
      },
      {
        id: 2,
        name: "John Smith",
        gender: "male",
        city: "London"
      },
      {
        id: 3,
        name: "James Jones",
        gender: "male",
        city: "New York"
      },
      {
        id: 4,
        name: "Mary Johnson",
        gender: "female",
        city: "Paris"
      },
      {
        id: 5,
        name: "Robert Lee",
        gender: "male",
        city: "Berlin"
      }
    ],
    schema: {
      model: {
        id: "id",
        fields: {
          name: {
            type: "string",
            editable: true
          },
          gender: {
            type: "string",
            editable: true
          },
          city: {
            type: "string",
            editable: true
          }
        }
      }
    }
  },
  navigatable: true,
  selectable: "row",
  editable: {
    mode: "incell",
    confirmation: false
  },
  edit: function(e) {
    console.log(e.sender.current().index());
  },
  change: function(e) {

  }
});
<link rel="stylesheet" href="https://kendo.cdn.telerik.com/2019.3.1023/styles/kendo.common.min.css">
<link rel="stylesheet" href="https://kendo.cdn.telerik.com/2019.3.1023/styles/kendo.rtl.min.css">
<link rel="stylesheet" href="https://kendo.cdn.telerik.com/2019.3.1023/styles/kendo.default.min.css">
<link rel="stylesheet" href="https://kendo.cdn.telerik.com/2019.3.1023/styles/kendo.mobile.all.min.css">

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<script src="https://kendo.cdn.telerik.com/2019.3.1023/js/kendo.all.min.js"></script>

<div id="grid" style="width:400px"></div>
jquery kendo-ui kendo-grid
1个回答
0
投票

您可以尝试使用jQuery .is()方法,并将当前单元格的表与网格的lockTable元素进行比较。

请参见jQuery - how to check if two elements are the same?

edit: function(e) {
    console.log(e.sender.current().index());
    let isLocked = e.sender.current().closest("table").is(e.sender.lockedTable);
    console.log("Is Locked Portion: ", isLocked);    
}

Example

© www.soinside.com 2019 - 2024. All rights reserved.