问题如图所示：jqgrid版本是5.0.0，所用样式是bootstrap版本3.3.6，解决上面问题，加如下样式.ui-jqgrid-hbox { overflow-y: scroll;}解决办法不一定每个人都好使，每个人有每个人的解决方法...
DataTable渲染
表
格
时
，
表
格中的数据长度太长，
表
格数据撑到右边后，看不到全部数据，所以想到增加一个水平
滚动
条解决此
问题
，确实增加了
“scrollX”: true,“autoWidth”:true 之后
问题
解决了，又引发了当浏览器的缩放比例改变以后，
表头
和行不对齐的
问题
；如图
原因是在table的div里多了一个div块，宽度都固定了，引起了
错位
问题
；
后来通过在网络咨询解决的方式是...
this.$refs.configurationTable.$el.children[1].style.width = '99.5%'
设置的是
表
格
表头
的宽度，因为下边
表
格宽度100%展示数据，还包含了一个
滚动
条的宽度，所以设置
表头
的宽度要比下边的宽度略短一点就好了，查出一个
滚动
条的宽度就好了。
datagrid自动加载的数据应该是不用担心有这个
问题
。这个
问题
主要是在我仅仅只是想用一下datagrid的框架样式手动放入数据
时
产生。
只要将datagrid的
表头
宽度设置一下就好了，之前因为想要他自适应，所以把设置的宽度删掉了
因列的field中，存在特殊字符或中文导致，将相应的字段替换为英文即可正常显示
columns: [{"field": '字段1', "title": ‘字段1’, width: '100px' }，
{"field": '字段2', "title": ‘字段2’, width: '100px' }]
这
时
就会
出现
表头
和
表
的内容
错位
这
时
候可改为：
columns: [{"field":...
将包含该弹窗的页面中的 datagrid 注释掉之后，
表头
正常显示，一加上就
出现
其他
表头
错乱的
问题
。
最正常的
问题
是，在拖动列宽的
时
候，没有起到任何的作用，无法正常的拖动。刷新之后，
表头
还是错乱的情况，没有任何改善。
搜集了好多种方法：
1. 说的是，filed 属性名称重复
2. 说的是，title 包含特殊字符
3. 说的是，返回数据中含有特殊字符
4.easyui有惰性，当有多个datagrid同
时
存在并且有人初始化查询过，就可能导致.
上下两个datagrid写法完全一样，但是第二个的设置的列宽始终不起作用，我到处百度，但其他人的方法始终不能解决这个bug,最后我发现调整两个datagrid写的位置，最后面那个datagrid的列宽就会失效.
最后走投无路的我只要在两个datagrid中间写一个无用的datagrid，最后将这个无用的datagrid隐藏起来，bug就消失了。
datagrid1
table i
```javascript
{name: 'myButton', index: 'myButton', width: 50, align: 'center', sortable: false, formatter: function(){return '<button id="myButton" class="btn btn-primary">Click</button>';}}
2. 在
jqGrid
的 loadComplete 事件中，为按钮绑定 click 事件回调函数，例如：
```javascript
loadComplete: function () {
$("#myButton").click(function(){
// 处理点击事件的逻辑
3. 在
jqGrid
的 gridComplete 事件中，重新设置
表头
的高度，以便将按钮显示出来，例如：
```javascript
gridComplete: function () {
var headerHeight = $(".ui-
jqgrid
-hdiv").height();
$(".ui-
jqgrid
-htable").height(headerHeight + 50);
其中，50 是按钮的高度加上一些额外的空隙。
通过以上步骤，就可以在
jqGrid
的
表头
中添加一个自定义按钮了。
