Question

我在我的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>

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

我真的不知道如何做到这一点。如何使用部分视图将Kendo控件放在Tabstrip中？

Answer 1

问题是，两个小部件都具有相同的ID。我在第二个标签中更改了ID，它运行正常。

如何在部分视图中放置Kendo控件？

1 个答案: