如何将 jqGrid、JQueryUI ColumnChooser 表转换为响应式表？答案

【问题标题】：How can I convert jqGrid, JQueryUI ColumnChooser table into a responsive one?如何将 jqGrid、JQueryUI ColumnChooser 表转换为响应式表？
【发布时间】：2014-06-14 12:26:50
【问题描述】：

这里是 SimpleLocalGridWithColumnChooser：[http://www.ok-soft-gmbh.com/jqGrid/SimpleLocalGridWithColumnChooser5.htm] 它使用 jqgrid、jq-UI 和多选插件。我想将上面链接中的整个网格转换为响应式网格。这是它的源代码http://pastebin.com/Gps8KLYP

【问题讨论】：

欢迎来到stackoverflow！如果您向我们展示您的尝试，而不是让它看起来像我们的家庭作业，我们可以为您提供更多帮助。
好的，谢谢你的信息。我会
您能更清楚地说明您需要什么吗？ “我想将其转换为响应式”的描述不够清楚。
@Oleg：链接中提供的网格没有响应。我只想把它变成响应式的，这样我也可以在智能手机上看到它。这是链接[ok-soft-gmbh.com/jqGrid/SimpleLocalGridWithColumnChooser5.htm]及其源代码pastebin.com/Gps8KLYP。
@DineshRavi：抱歉，我还是不明白你是如何定义“响应式网格”的，以及你到底有什么问题。

标签： jquery jquery-ui twitter-bootstrap jqgrid responsive-design

【解决方案1】：

将你的 jqgrid 放在一个 div 中：

<div id ="gridDiv">
    <table id="list"></table>
    <div id="pager" style="text-align:center;"></div>
</div>

然后添加以下JS：

$(window).bind('resize', function() {
    $('.ui-jqdialog').center();
    $("#list").setGridWidth($('#gridDiv').width(), true);
    $("#pager").setGridWidth($('#gridDiv').width(), true);
});

【讨论】：

我尝试了您的解决方案。它仍然没有响应。我不知道我应该把js放在哪里。这是它的源代码pastebin.com/Gps8KLYP。你能把它准确地放在来的地方吗？