1

我在我的 C# MVC 项目的某个区域中放置了一个 Kendo Tabstrip。

<div id="tabstrip">
<ul>
    <li class="k-state-active">
        Teachers
    </li>
    <li>
        Students
    </li>
</ul>
<div id="teachers">
    @{ Html.RenderPartial("Teachers"); }
</div>
<div id="students">
    @{ Html.RenderPartial("Students"); }
</div>
</div>

如您所见，只有两个选项卡，我将它们的内容放在部分视图中。

问题是，我想在这些局部视图中放置更多的 Kendo 控件。我希望两个选项卡都有 Kendo Grid、AutoComplete 小部件等。因此，我将以下代码放入 Teachers.cshtml 中：

<input id="products" style="width: 250px" />

<script>
    $(document).ready(function () {
        var data = { "foo": ["item 1", "test 2", "item 3"] };
        $("#products").kendoAutoComplete({
            filter: "contains",
            minLength: 2,
            dataSource: {
                data: data,
                schema: {
                    data: "foo"
                }
            }
        });
    });
</script>

这只是一个标准的自动完成小部件。当我将它放在其中一个选项卡中时它工作正常，但如果我尝试将相同的代码放在两个选项卡中，它就不起作用。第input一个选项卡上的字段与屏幕一样宽，当我在第二个选项卡上输入内容时，没有显示任何建议。

我真的不知道该怎么做。如何使用局部视图将 Kendo 控件放入 Tabstrip 中？

4

1 回答 1

1

问题是，两个小部件具有相同的 ID。我在第二个选项卡中更改了 ID，它工作正常。

于 2014-03-10T20:31:35.387 回答