JQGRID - 在网格上定义 setGroupHeaders 时，列选择器太慢答案

【问题标题】：JQGRID - Column chooser too slow when setGroupHeaders defined on gridJQGRID - 在网格上定义 setGroupHeaders 时，列选择器太慢
【发布时间】：2012-02-01 10:51:38
【问题描述】：

我的列选择器有问题，选择要添加或删除的列后显示结果非常慢。我注意到“setGroupHeaders”是问题所在。 Chooser 和 Group Header 这对夫妇的列似乎没有很好的表现。

我在 JqGrid 4.3.1 上，使用最后一个 jquery 库。以前的版本也会出现这个问题（我必须更新所有库以确保问题不是来自旧版本）。

我真的在论坛上搜索过任何关于此的帖子，但我找不到任何东西。我是唯一一个有这个问题的人吗？引用了吗？

提前感谢您的帮助！！

【问题讨论】：

我遇到了同样的情况，希望在这里找到解决方案，所以不，你不是唯一的，但我不知道解决方案。

标签： jqgrid column-chooser

【解决方案1】：

在大量列（>500 列）上，我遇到了同样的列选择器速度极慢的问题。因为我使用的是treegrid，所以我不能服用大多数性能增强药物（我的意思是调整）。有时，仅应用和重绘网格就需要 3 分钟以上。

但是，我想出了一个肮脏残酷的方式来解决问题。对我来说独特之处在于我总是保留一份数据副本（js 中本地的 json 格式）。因此，任何重绘都不会产生网络流量。因此，我自己实现了一个列选择器，并进行了残酷的卸载并重新创建了网格。现在，应用所选列并重绘最多需要 10 多秒。

这是我的列选择器的代码。正如你所看到的，它对我的程序来说是高度专业化的，但你可以得到一个想法。 Fansy GUI 来自here，如果我写了一些糟糕的代码，请原谅我。

choose_column: function() {
  var me = this;
  var rn=this.response_json.colNames;
  var rm=this.response_json.colModel;
  var line_text;

  var html_text = '<select id="column_selector" class="multiselect" multiple="multiple" name="countries[]" style="width: 500px; margin: 0px auto; height: 340px; ">\n';

  for ( var i = 0 ; i < rn.length; i++ ) {
    if (rm[i].hidden) {
      line_text = '<option value="'+i+'">'+rn[i]+'</option>\n';
    } else {
      line_text = '<option value="'+i+'" selected="selected">'+rn[i]+'</option>\n';
    }
    html_text += line_text;
  }

  html_text += '</select>';

  jQuery("#dlg_choose_columns").empty()
  .append(html_text);
  jQuery(".multiselect").multiselect({
    sortable: true, 
    searchable: true,
    hide: 'explode',
    show: 'blind',
    dividerLocation: 0.5
  });
  jQuery("#dlg_choose_columns").dialog({
    width: 535,
    height: 550,
    modal: true,
    title: 'Select Columns',
    hide: 'explode',
    buttons: {
      "Ok": function() {
        var selected_values = jQuery(".multiselect").val();
        for ( var i = 0; i < rn.length; i++ ) {
          rm[i].hidden = true;
        }
        for ( var i = 0; i < selected_values.length; i++ ) {
          delete rm[selected_values[i]].hidden;
        }
        jQuery("#dlg_choose_columns").dialog("close"); 
        me.unload_jqgrid();
        me.create_grid(null, me.is_tree, me.need_plot);
      },
      "Cancel": function() {
        jQuery("#dlg_choose_columns").dialog("close"); 
      }
    }
  });

}

【讨论】：