如何在ASP.NET MVC项目上加载KendoUI外部模板?

时间:2013-01-28 21:39:20

标签: templates asp.net-mvc-4 kendo-ui

我正在尝试加载一个KendoUIexternal模板,我尝试按照this页面中的说明操作,但我似乎无法加载我的模板。我收到以下错误:

GET http://localhost:65097/Templates/_basicTemplates.html 404 (Not Found) 

我的模板文件夹位于我的Views文件夹中,看起来像this

尝试加载它的页面位于Views / Main.aspx的Views文件夹中,该文件如下所示:

<html>
<head>
    <title></title>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
    <link href="<%: Url.Content("~/Content/kendo/2012.3.1114/kendo.common.min.css")%>" rel="stylesheet" type="text/css" />
    <link href="<%: Url.Content("~/Content/kendo/2012.3.1114/kendo.default.min.css")%>" rel="stylesheet" type="text/css" />
    <script src="http://code.jquery.com/jquery-1.7.min.js" type="text/javascript"></script>
    <script src="<%: Url.Content("~/Scripts/kendo/2012.3.1114/kendo.web.min.js")%>"></script>
    <script src="<%: Url.Content("~/Scripts/jquery.signalR-1.0.0-rc1.min.js")%>" type="text/javascript"></script>
    <script type="text/javascript" src="http://ecn.dev.virtualearth.net/mapcontrol/mapcontrol.ashx?v=6.3"></script>
    <script src="<%: Url.Content("~/Scripts/index/templateLoader.js")%>" type="text/javascript"></script>
    <script src="<%: Url.Content("~/Scripts/index/main.js")%>" type="text/javascript"></script>



</head>
<body onload="GetMap();">
    <div id="canvasDiv" style="position: absolute; top: 0px; left: 0; width: 100%; height: 100%; background-color: transparent; left: 10px; overflow:auto">
        <div id="mainDiv" style="position: absolute; top: 0px; left: 0; width: 100%; height: 100%; background-color: transparent; left: 10px; overflow:auto">
            <div id="leftBar" style="border: thin solid #666666; position: absolute; top: 0px; left: 0; width: 180px; height: 100%; background-color: #ECFFFF; left: 10px; overflow:auto; z-index:20">
                <button id="btnUsuarios" value="Usuarios" style="position: absolute;left: 10px; right: 10px; top: 10px; width: auto; height: 50px" class="k-button" onclick="swapDiv(this)">Usuarios</button><br />
                <button id="btnRegiones" value="Regiones" style="position: absolute;left: 10px; right: 10px; top: 70px; width: auto; height: 50px" class="k-button" onclick="swapDiv(this)">Regiones</button><br />
                <button id="btnClusters" value="Clusters" style="position: absolute;left: 10px; right: 10px; top: 130px; width: auto; height: 50px" class="k-button" onclick="swapDiv(this)">Clusters</button><br />
                <button id="btnDispositivos" value="Dispositivos" style="position: absolute;left: 10px; right: 10px; top: 190px; width: auto; height: 50px" class="k-button" onclick="swapDiv(this)">Dispositivos</button><br />
                <button id="btnEventos" value="Eventos" style="position: absolute;left: 10px; right: 10px; top: 250px; width: auto; height: 50px" class="k-button" onclick="swapDiv(this)">Eventos</button><br />
            </div>
            <div id="selectionBar" style="border: thin solid #666666; position: absolute; top: 0px; left: 0; width: 180px; height: 100%; background-color: #DFF8FF; left: 10px; overflow:auto; z-index:9">
                <div class="k-toolbar k-grid-toolbar">
                    <a class="k-button k-button-icontext k-add-button" href="#"><span class="k-icon k-add"></span>Agregar</a>
                </div>
                <div id="listView" ></div>
            </div>
            <div id='myMap' style="border: thin solid black; position: absolute; display: block; min-height: 100%; top: 0px; left: 189px; width: 88%; "></div>
        </div>
    </div>
    <script>
        templateLoader.loadExtTemplate("../Templates/_basicTemplates.html");
    </script>
</body>
</html>

如何成功将模板加载到我的页面中?感谢您提前提供任何帮助。

2 个答案:

答案 0 :(得分:1)

我找到了一种加载模板的简单方法,我找到了this页面,并且.tt描述了从外部文件加载模板的惊人方法。您只需确保变量root是所有模板根位置的正确字符串。

答案 1 :(得分:0)

@Uriel Arvizu:已提到我们的解决方案,但现在我们建议使用已编译的KendoUI模板。 Here是详细信息。