2014-01-31 75 views
2

我在我的web應用程序中使用Kendo Grid幷包含kendo.all.min.js文件。這個js文件的版本是2012.1.515。 在網格中,列在IE 10和IE 11中不可調整大小,但它在所有其他瀏覽器中都可以正常工作。Kendo Grid的列在IE 10和IE 11中不可調整

我創建網格的樣本,包括相同的文件,但格列不是在IE 10和IE 11 調整大小下面是我的示例代碼:

<!DOCTYPE html> 
<html> 
<head> 
    <title></title> 
    <link href="http://cdn.kendostatic.com/2013.3.1324/styles/kendo.common.min.css" rel="stylesheet" /> 
    <link href="http://cdn.kendostatic.com/2013.3.1324/styles/kendo.rtl.min.css" rel="stylesheet" /> 
    <link href="http://cdn.kendostatic.com/2013.3.1324/styles/kendo.silver.min.css" rel="stylesheet" /> 
    <link href="http://cdn.kendostatic.com/2013.3.1324/styles/kendo.dataviz.min.css" rel="stylesheet" /> 
    <link href="http://cdn.kendostatic.com/2013.3.1324/styles/kendo.dataviz.silver.min.css" rel="stylesheet" /> 
    <link href="/kendo-ui/content/shared/styles/examples.css" rel="stylesheet" /> 
    <script src="http://code.jquery.com/jquery-1.7.1.min.js"></script> 
    <script src="http://cdn.kendostatic.com/2012.1.515/js/kendo.all.min.js"></script> 


</head> 
<body> 

     <div id="main"> 
    <h1 id="exampleTitle"> 
      <span class="exampleIcon gridIcon"></span> 
      <strong>Grid /</strong> Column resizing </h1> 

    <div id="theme-list-container"></div> 

    <div id="exampleWrap"> 
     <script>preventFOUC()</script> 


     <div id="example" class="k-content"> 
      <div id="grid"></div> 

      <script> 
       $(document).ready(function() { 
       gridDataSource = new kendo.data.DataSource({ 
       transport: { 
              read: "http://demos.telerik.com/kendo-ui/service/Northwind.svc/Orders" 
             }, 
            }); 
        $("#grid").kendoGrid({ 
         dataSource: gridDataSource, 
         scrollable: true, 
         resizable: true, 

         columns: [ 
          { 
           field: "OrderDate", 
           title: "Order Date" 


          }, 
          { 
           field: "ShipCountry", 
           title: "Ship Country" 

          }, 
          { 
           field: "ShipCity", 
           title: "Ship City" 

          }, 
          { 
           field: "ShipName", 
           title: "Ship Name" 

          }, 
          { 
           field: "ShippedDate", 
           title: "Shipped Date" 

          }, 
          { 
           field: "OrderID", 
           title: "ID" 

          } 
         ] 
        }); 
       }); 
      </script> 
     </div> 
    </div> 
    </div> 

</body> 
</html> 

感謝

+0

在Telerik的開發人員和支持論壇上,您可能有更好的運氣問這個問題:http://www.telerik.com/forums/kendo-ui-web/grid –

回答

1

我想,您需要爲每個要指定大小的列指定寬度。像這樣:

 
    columns: [ 
    { 
     field: "OrderDate", 
     title: "Order Date", 
     width: 50px 
    } 
我希望這是有幫助的。

+0

寬度應該相同嗎?因爲我也面臨同樣的問題,可調整大小不工作與最新的劍道版本:( – Steve

0

我在點擊ie10和11時遇到了一些問題.Telrik建議我用最新版本更新我的js和css。最終解決了我的問題。嘗試在2013年更新您的劍道版本。2013年他們有4/5更新,去3/4。