jquery - 如何销毁剑道标签内的剑道网格？

Question

标签：

<div id="parentTabStrip">
            <ul>
                <li class="k-state-active">Titles</li>
                <li>Commercials</li>
            </ul>
            <div id="titlesGrid"></div>
            <div id="commercialsGrid"></div>
        </div>

在页面加载时，会创建网格：

    <script type="text/javascript">
        var year = $("#txtYear").val();
        createTitlesGrid(year);
        createCommercialsGrid();
    </script>

我正在尝试销毁事件中的网格，但 jquery 选择器没有找到我的网格：

<script type="text/javascript">
            var year = $("#txtYear").val();
            createTitlesGrid(year);
            createCommercialsGrid();

            $('#txtYear').on('change', function ()
            {
                debugger;

                $('#titlesGrid').data("kendoGrid").destroy();

                $('#commercialsGrid').data("kendoGrid").destroy();

                //var year = this.value;
                //createTitlesGrid(year);
                //createCommercialsGrid();
            });
        </script>

它一直在说：

TypeError：无法调用 null 的方法“销毁”

Answer 1

考虑到您正在以正确的方式创建剑道网格，这应该可以：

<script type="text/javascript">
      $(document).ready(function() {
            var year = $("#txtYear").val();
            createTitlesGrid(year);
            createCommercialsGrid();

            $('#txtYear').on('change', function ()
            {
                debugger;

                $('#titlesGrid').data("kendoGrid").destroy();

                $('#commercialsGrid').data("kendoGrid").destroy();

                //var year = this.value;
                //createTitlesGrid(year);
                //createCommercialsGrid();
            });
       });
</script>

尝试：

var grid = $('#titlesGrid').data("kendoGrid");
grid.destroy();

剑道 ui 文档： http ://docs.kendoui.c​​om/api/web/grid#methods-destroy

Answer 2

var kendoGrid = $("#grid").data("kendoGrid");
kendoGrid.destroy(); // Unhook from DOM
$("#grid").remove(); // Remove from DOM