【问题标题】:Handsonetable - can't hide columnsHandsonetable - 无法隐藏列
【发布时间】:2015-11-03 14:21:13
【问题描述】:

我试图隐藏几列。这是我的代码:

function setTable(options){

    var data = options.data;
    var container = options.container;
    var dataSchema = options.dataSchema;
    var colHeaders = options.colHeaders;
    var columns = options.columns;

    var table = new Handsontable(container, {
        data: data,
        disableVisualSelection:true,
        dataSchema: dataSchema,
        colHeaders:colHeaders,
        columns:columns,
        currentRowClassName: 'selected',
        columnSorting:true,
        columnStreching:true,
        autoColumnSize: true,
        stretchH: 'all',
        outsideClickDeselects: false 

    });
    Handsontable.hooks.add('afterSelectionEnd', function(e){
        var data = this.getDataAtRow(e);
        moveToAlert({
            n:data[1],
            v:data[4],
            lt:data[7],
            ln:data[8]
        });
    }, table);
    Handsontable.hooks.add('afterOnCellMouseOver', function(e,c){
        var data = this.getDataAtRow(c.row);
        if(data[0] == null) return false;
        moveToAlert({
            n:data[1],
            v:data[4],
            lt:data[7],
            ln:data[8]
        })
    }, table);

    return table;
}

actualData.push(
{
    reg:d.r, 
    name:d.n, 
    fd:d.fd, 
    td:d.td, 
    v:d.v, 
    rgps:d.rg, 
    loc:"PL, Wrocław, Autostradowa Obwodnica Wrocławia",
    lt:d.lt,
    ln:d.ln,
    c:'a_'+d.c
}
);   
}

if (TABLE_ACTUAL) TABLE_ACTUAL.destroy();
TABLE_ACTUAL = setTable({
  data:actualData,
  container:document.getElementById('actual-table'),
  dataSchema:{reg: null, name: null, fd: null, td: null, v: null, rgps: null, loc: null, lt:null, ln:null,c:null},
  colHeaders:["Pojazd", "Nazwa", "Od", "Do", "Wartość", "Droga", "Lokalizacja"],
  columns:[
    {
        data:"reg",
        editor:false,
    },
    {
        data:"name",
        editor:false,
    },
    {
        data:"fd",
        editor:false,
    },
    {
        data:"td",
        editor:false,
    },
    {
        data:"v",
        editor:false,
    },
    {
        data:"rgps",
        editor:false,
    },
    {
        data:"loc",
        editor:false,
    }
],
});

所以我想隐藏最后 3 列(lt、ln、c)并禁用所有列上的编辑器。为什么这种方式不起作用?我不想使用customrender,因为我认为它没有必要。

编辑 已解决(感谢@ZekeDroid)

我使用 getSourceDataAtRow() 而不是 getDataAtRow()。 也用于排序表的修复:http://docs.handsontable.com/0.16.1/demo-sorting-data.html,更具体地说:physicalIndex = instance.sortIndex[logicalIndex][0]; 作为选定行的索引。

【问题讨论】:

  • “不工作”是什么意思?你能拿出小提琴吗?

标签: javascript html css handsontable


【解决方案1】:

这可能是由于dataSchema 选项。您包括要在此处显示的列,即使为空。尝试完全删除 dataSchema 选项。但请提供一个小提琴,以便我们更加确定。

【讨论】:

  • 如果我将它们从dataSchema 中删除,它们将被隐藏,但我也无法从getDataAtRow() 获取这些数据。我希望你明白我的意思:) 在钩子afterOnCellMouseOver 中,我从行中获取数据,我需要ltln,但不想显示它们。很快就会添加小提琴。
  • 我很确定你可以改用metaData 方法,它会显示隐藏的数据,让我仔细检查一下
  • 试试getSourceDataAtRow()
  • 这很有帮助。但是排序的列呢?当表未排序时,一切正常,排序后行的索引与 sourceData 不同。如何解决?
  • 好的,我找到了解决方案。 docs.handsontable.com/0.16.1/demo-sorting-data.html 只需使用这个physicalIndex = instance.sortIndex[logicalIndex][0];。感谢您的帮助:)
猜你喜欢
  • 2012-12-12
  • 1970-01-01
  • 2016-03-15
  • 2021-09-27
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
相关资源
最近更新 更多