醉汀雨笙 发表于 2020-12-4 10:02:07

grid单元格编辑结束后跳向指定步长的单元格

首先选定一个默认的单元格。该单元格编辑结束后,跳向此单元格后三个的单元格位置。默认选中第一行的start 编辑结束后,自动跳转到 第一行的Product 此单元格编辑结束后,自动跳转到第二行的start......以此类推,请问可以实现这个功能吗?


KevinChen 发表于 2020-12-4 10:02:08

你好,这个需求用事件可以解决,参考以下代码:

import 'bootstrap.css';
import '@grapecity/wijmo.styles/wijmo.css';
import './styles.css';
import * as wjGrid from '@grapecity/wijmo.grid';
import * as wjCore from '@grapecity/wijmo';
//
document.readyState === 'complete' ? init() : window.onload = init;
//
function init() {
    //
    // create some random data
    var countries = 'US,Germany,UK,Japan,Sweden,Norway,Denmark'.split(',');
    var data = [];
    for (var i = 0; i < countries.length; i++) {
      data.push({
            id: i,
            country: countries,
            sales: Math.random() * 10000,
            expenses: Math.random() * 5000,
            overdue: (i + 1) % 4 == 0
      });
    }
    //
    // show the data in a grid
    var theGrid = new wjGrid.FlexGrid('#theGrid', {
      itemsSource: data,
      columns: [
            { binding: 'id', header: 'ID', width: 50, isReadOnly: true },
            { binding: 'country', header: 'Country', isRequired: true, dataMap: countries },
            { binding: 'sales', header: 'Sales', format: 'n2' },
            { binding: 'expenses', header: 'Expenses', format: 'n2' },
            { binding: 'test', header: 'Test', format: 'n2' },
            { binding: 'overdue', header: 'Overdue' }
      ],
      cellEditEnded: function (s, e) {
            var col = s.columns;
            var row = e.row;
            if (col.binding == 'sales') {
                console.log('编辑结束,跳转到Test')
                setTimeout(()=>{
                  s.selection = new wjGrid.CellRange(row, e.col+2, row, e.col+2);
                })
            }
      }
    });
    //
    // show log message
    var elLog = document.getElementById('log');
    function showMessage(msg) {
      elLog.innerHTML = msg;
    }
}


测试地址:
https://demo.grapecity.com.cn/wijmo/demos/Grid/Events/Editing/purejs

替换app.js后,编辑Sales列可以看到效果。

醉汀雨笙 发表于 2020-12-4 14:54:37

已测试成功!谢谢。

KevinChen 发表于 2020-12-4 14:58:42

不客气,感谢您的反馈,本贴结帖了,有新的问题欢迎发新帖交流~!
页: [1]
查看完整版本: grid单元格编辑结束后跳向指定步长的单元格