【问题标题】:kendoDropDownList resetting inside kendoGrid after sortkendoDropDownList 排序后在 kendoGrid 内重置
【发布时间】:2013-11-12 16:57:45
【问题描述】:

我在 kendoGrid 的一个单元格中添加了一个 kendoDropDownList,它一开始运行良好。但是,当我单击列标题进行排序时,单元格会丢失其格式。有人知道如何防止这种情况吗?这是一个简单的示例:

<html>
<head>
    <title>test</title>
    <link href="/kendoui.web.2013.2.716.open-source/styles/kendo.common.min.css" rel="stylesheet" type="text/css"/>
    <link href="/kendoui.web.2013.2.716.open-source/styles/kendo.default.min.css" rel="stylesheet" type="text/css"/>
    <script src="/kendoui.web.2013.2.716.open-source/js/jquery.min.js"></script>
    <script src="/kendoui.web.2013.2.716.open-source/js/kendo.web.min.js" type="text/javascript"></script>
</head>
<body>
    <table class="gridTable">
        <thead>
        <tr>
            <th data-field="name">Name</th>
            <th data-field="options">Options</th>
        </tr>
        </thead>
        <tbody>
        <tr>
            <td class="wrap">Item</td>
            <td>
                <select class="menuBar" style="width:80px;">
                    <option>Big</option>
                    <option>Medium</option>
                    <option>Small</option>
                </select>
            </td>
        </tr>

        </tbody>
    </table>
    <script type="text/javascript">
        $(document).ready(function() {
            $(".gridTable").kendoGrid({
                sortable: true
            });

            $(".menuBar").kendoDropDownList({
            });
        });
    </script>
</body>
</html>

【问题讨论】:

  • 奇怪的是,如果你在底部交换 gridTable 和 menuBar 初始化,下拉列表不起作用,但是当你对它们进行排序时,css 不会被剥离。
  • 我找不到阻止重新格式化的方法,但发现在网格初始化后调用 dataBound 事件,并且每次对其进行排序,所以这似乎有效:$(document) .ready(function() { $(".gridTable").kendoGrid({ sortable: true, dataBound:function(e) { var el=e.sender.element[0]; $(el).find(". menuBar").kendoDropDownList({ }); } }); });可能有比 e.sender.element[0] 更好的变量可以使用,但我找不到。

标签: sorting grid kendo-ui kendo-dropdown


【解决方案1】:

每次执行 Page/Sort/Group 等操作时都会重建 Grid。对于这种情况,您需要使用 Grid 的 dataBound 事件来重新初始化任何小部件或执行任何影响显示内容的 JavaScript 代码Grdi。

【讨论】:

    猜你喜欢
    • 1970-01-01
    • 2012-11-10
    • 1970-01-01
    • 1970-01-01
    • 2022-01-12
    • 2016-01-18
    • 1970-01-01
    • 2011-11-25
    • 2015-09-16
    相关资源
    最近更新 更多