【问题标题】:Handsontable trimRows works incorrectlyHandsontable trimRows 工作不正确
【发布时间】:2017-06-10 06:15:15
【问题描述】:

我有一个非常讨厌的问题,即在 handsontable 中隐藏和显示一些行。 非常简化的场景,我需要根据一些业务条件隐藏和显示行。

为此,我正在使用 trimRows 和 untrimRows,总体来说效果很好,直到关闭列排序。 如果开启,则在 untrim / trim 方法调用并重新渲染网格后,网格中会出现空行。

请看小提琴:http://jsfiddle.net/n8ggsbob/13/

columnSorting: {
                    column: 0,
                    sortOrder: true
                }
    var fake = [1, 2, 3, 4, 5, 6, 7, 8, 10];
    hot.getPlugin('trimRows').untrimRows(fake);
    hot.getPlugin('trimRows').trimRows(fake);
    hot.render();

只需点击提交按钮,就会发现出现了很多空行(或者只是没有删除)

但如前所述,如果我删除排序所有工作都很好:http://jsfiddle.net/n8ggsbob/14/

var fake = [1, 2, 3, 4, 5, 6, 7, 8, 10];
hot.getPlugin('trimRows').untrimRows(fake);
hot.getPlugin('trimRows').trimRows(fake);
hot.render();

从这些空行的外观中唯一有帮助的是调用 updateSettings 方法,但随后排序被重置:http://jsfiddle.net/n8ggsbob/16/

    var fake = [1, 2, 3, 4, 5, 6, 7, 8, 10];
    hot.getPlugin('trimRows').untrimRows(fake);
    hot.getPlugin('trimRows').trimRows(fake);

    hot.updateSettings({});
    hot.render();

是否有人遇到过类似的问题,或者我只是错过了什么?

非常感谢, 亚历克斯

【问题讨论】:

    标签: javascript handsontable


    【解决方案1】:

    我不知道你为什么要先取消修剪,然后再修剪:

    hot.getPlugin('trimRows').untrimRows(fake);
    hot.getPlugin('trimRows').trimRows(fake);
    

    但无论如何,这就是您的问题的原因。删除第一个示例中的 untrimRows 函数,您会看到问题消失了。

    同样,我不确定您要实现什么,但例如,如果您有两个按钮,一个用于隐藏,另一个用于再次显示,则与排序功能没有冲突:@987654321 @。

    【讨论】:

    • 嘿fap,感谢您的快速回答。我正在尝试对网格进行某种全局搜索。假设用户键入一些关键字然后单击搜索按钮,此时网格应该取消修剪所有先前的行,然后修剪所有不包含搜索文本的行。这就是为什么我要在同一个函数中进行修剪和取消修剪。
    • 好吧,在这种情况下,仅供参考,我想做几乎相同的事情,但不使用 PRO 版本:stackoverflow.com/questions/39769474/…
    • 是的,我最近看到了那个帖子,谢谢。但我害怕在每个过滤器上加载数据。事情是我目前正在处理的页面非常复杂(编辑、删除、添加),并且使用 loadData 会导致一些“意外”结果的风险。但是使用 trimRows 插件看起来更安全。
    • 是的,当然,以防万一你没看到 :) 正如我所说,这确实是不使用 PRO 版本的解决方法,但是,是的,我设法到达编辑/添加/删除行的安全解决方案,所以请注意这是可行的。 (我什至对 1 个表格进行了 950 页的分页,它仍然是可编辑的,但正如我在 Q/A 中所说,现在它本身几乎就是一个完整的框架......)。不管怎样,我的回答解决了你的问题还是你还有问题?
    • 不幸的是,我不得不使用那个 PRO 版本,伤心。有一个丑陋的 hack 可以解决 untrim/trim jsfiddle.net/n8ggsbob/18 的问题,但我讨厌超时。
    猜你喜欢
    • 2013-08-29
    • 2019-07-21
    • 2018-06-09
    • 1970-01-01
    • 2016-04-11
    • 2014-09-18
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    相关资源
    最近更新 更多