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});
}