CODEWITHSUNDEEP
templatesasp.net-mvc-4kendo-ui
Uriel Arvizu
Uriel Arvizu

Reputation: 1926

How to load KendoUI external templates on a ASP.NET MVC project?

I'm trying to load an KendoUIexternal template, I tried to follow the instructions in this page, but I can't seem to load my template. I get the following error:

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

My Templates folder is inside my Views folder and looks like this.

The page that is trying to load it is inside the Views folder, at Home/Main.aspx, that file looks like this:

<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>

How can I successfully load the template into my page? thanks for any help in advance.

Upvotes: 0

Views: 2000

Answers (2)

Vladimir Nesterovsky
Vladimir Nesterovsky

Reputation: 649

@Uriel Arvizu: has referred to our solution, but now we'd like to suggest to use compiled KendoUI templates. Here are the details.

Upvotes: 0

Uriel Arvizu
Uriel Arvizu

Reputation: 1926

I found an easy way to load my templates, I found this page and the .tt described there is an amazing way to load a templete from an external file. You just have to make sure the variable root is the correct string to the root location of all of your templates.

Upvotes: 1

Related Questions