Question

我在我的网络应用中使用了Kendo Grid，包括kendo.all.min.js文件。此js文件的版本是2012.1.515。在网格中，虽然它在所有其他浏览器中都可以正常工作，但是在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>

由于

Answer 1

我认为，您需要为每个要调整大小的列指定宽度。就像是：

    columns: [
    {
        field: "OrderDate",
        title: "Order Date",
        width: 50px
    }

我希望这有用。

Answer 2

我在点击ie10和11时遇到了一些问题.Telerik建议我用最新版本更新我的js和css。这最终解决了我的问题。尝试在2013年更新你的剑道版本。他们在2013年有4/5更新，去3/4。

Kendo Grid的列在IE 10和IE 11中无法调整大小

2 个答案: