MVC5视图和Kendo Splitter - 2个内容覆盖1

Question

TLDR;为什么pane 2 contentUrl数据覆盖pane1 contentUrl数据。详情如下。

好的，我们在这里接受教育，并试图学习更多基于Web的开发，同时过快地开发应用程序。使用MVC 5和Telerik（剑道）我试图创建一个spitter而不是来自4个不同局部视图的加载。目前我只是使用来自Telerik网站的虚拟/演示数据。

当页面加载时，它将简要显示@ Url.Content（“〜/ Productivity”）的内容，然后它被@ Url.Content（“〜/ QualityControl”）的内容替换，但标题不会改变。

Productivity和QualityControl都是部分视图，由关联的控制器返回。 SpanOfControl和Position Control当前只返回H2头。

public ActionResult Index()
        {
            return View("_ProductivityPartial");
        }

public ActionResult Index()
    {
        return View("_QualityControlPartial");
    }

---

index.cshtml上的HTML / Javascript

<div id="verticalSplit">
<div id="topHorizontal">
    <div id="top-left">Top Left</div>
    <div id="top-right">Top Right</div>
</div>
<div id="bottomHorizontal">
    <div id="bottom-left">Bottom Left</div>
    <div id="bottom-right">Bottom Right</div>
</div>

<script type="text/javascript">
 $(document).ready(function () {

    $("#verticalSplit").kendoSplitter({
        orientation: "vertical",
        panes: [
            { collapsible: true, expand: true, resize: false },
            { collapsible: true, expand: true, resize: false }
        ]
    });
   $("#topHorizontal").kendoSplitter({
        orientation: "horizontal",
        panes: [
            { contentUrl: "@Url.Content("~/Productivity")" },
            { contentUrl: "@Url.Content("~/QualityControl")" }
        ]
    });
    $("#bottomHorizontal").kendoSplitter({
        orientation: "horizontal",
        panes: [
            { contentUrl: "@Url.Content("~/SpanOfControl")" },
            { contentUrl: "@Url.Content("~/PositionControl")" }
        ]
    });

Answer 1

所以我做了很多挖掘，并且实际上在2小时前找到了答案，但在Telerik的支持下仍然含糊不清。

由于我使用Telerik UI对ASP.NET MVC稍加修改的演示，我忘记更改图表的名称。我决定发布这个答案，因为我在写这个问题时已经意识到了。即使它们位于不同的视图和控制器中，当试图在同一页面上显示它们时，您可能会遇到我遇到的问题。由于图表在各自的页面上完美运行，因此更加令人困惑。

因此，如果您想在单独的页面上使用2个图表/控件但仍希望在同一页面上显示它们（通过视图/网格/窗格等），请确保更改下面的名称。

默认：

Html.Kendo().Chart()
  .Name("chart")