KendoUI Grid使用中，在列宽超出屏幕无数据下显示滚动条

KendoUI Grid使用中，在列宽超出屏幕无数据下显示滚动条

kendoGrid 在使用中显示的列比较多，在这种情况下，设置column属性width如：

 			{
                title: "序号",
                filterable: false,
                width: "50px",
                attributes: {
                    style: "text-align: center;"
                }
            }

在这种情况下，如果所有的列的width超出表格的宽度就会出现滚动条，如图：

但是在使用中发现，如果查询的数据为空，则滚动条消失，表头出现显示不全的现象。在查找kendoUI的api后未发现没有方法或者属性可以控制这种情况，于是在页面仔细检查，终于发现在数据源的数据为空的情况下，table的宽度虽然依然超出屏幕，但是数据内容区域的高度为0，滚动条无法出现的原因找到。


在此情况下，于是想到赋予元素高度，在通过在dataBound方法中赋予该元素高度1px，滚动条终于出现，问题解决。

附上js代码：

 * grid 在筛选数据过程中无数据会导致列显示不全，
 * 此方法作用是显示表头，可以重新选择筛选条件
 * <br>
 * 示例方法：...
 *         dataBound:function (e) {
 *              setTableOverFlow(this);
 *          },
 *          ...
 * <br>
 * @param target 在dataBound中传入this对象,参考示例方法
 */
function setTableOverFlow(target) {
	//判断数据源数据为空
    if (target.dataSource.total() == 0) {
        var content = $(target.element).find(".k-grid-content-expander");
        if (content) {
            $(content).css("height",'1px');
        }
    }
    //表头需要自动滑动到左侧对齐，在超出屏幕的列上进行筛选，列不会自动返回到左侧，造成数据与表头错误，此方法解决这个问题
    $(target.element).find('.k-grid-header-wrap.k-auto-scrollable').scrollLeft(0).animate({scrollTop: $(target.element).offset().left});
}