免费的 jqGrid，列选择器弹出 UI 未正确显示答案

【问题标题】：free jqGrid, column chooser popup UI not appearing correctly免费的 jqGrid，列选择器弹出 UI 未正确显示
【发布时间】：2018-05-17 20:54:40
【问题描述】：

我正在使用免费的 jqgrid 并实现了列选择器来显示隐藏列，该功能按预期工作，但显示的弹出窗口没有正确呈现 UI。

我尝试了很多搜索并浏览了免费 jqgrid 的文档，但我不知道我做错了什么。

我能够在下面的 url 中重现演示中的错误。

如果有人遇到过类似的问题，请帮忙。注意我使用的是引导主题。

$("#sampleGrid").navButtonAdd('#sampleGridPager',{
        caption: "",
        title: "Choose Columns",
        buttonicon: "fa fa-table",
        onClickButton: function () {
           $("#sampleGrid").jqGrid('columnChooser');
        }
});

https://jsfiddle.net/1vk5ku2y/2/

【问题讨论】：

演示需要添加 jQuery UI CSS 因为它需要columnChooser。您应该添加一些 jQuery UI 主题，它对应于 Bootsrap CSS 主题。在那之后，已经获得了很好的结果：jsfiddle.net/OlegKi/1vk5ku2y/4。您只需添加一些小的 CSS 修复即可获得最终解决方案。
成功了，谢谢！！
不客气！我发布了与答案相同的信息。

标签： jqgrid free-jqgrid

【解决方案1】：

需要将 jQuery UI CSS 添加到演示中，因为 columnChooser 需要它。您应该添加一些 jQuery UI 主题，它对应于 Bootsrap CSS 主题。例如

https://cdnjs.cloudflare.com/ajax/libs/jqueryui/1.12.1/jquery-ui.min.css

在那之后，已经获得了更好的结果https://jsfiddle.net/OlegKi/1vk5ku2y/4/。您需要添加一些小的 CSS 修复以获得最终解决方案。

【讨论】：