问题描述:

I am using JSRender to render a template.

I am using the first example in demos -

<!DOCTYPE html>

<html>

<head>

<script src="http://code.jquery.com/jquery.js" type="text/javascript"></script>

<script src="../../jsrender.js" type="text/javascript"></script>

<link href="../resources/demos.css" rel="stylesheet" type="text/css" />

</head>

<body>

<a href="../demos.html">JsRender Demos</a><br />

<h3>Render template against local data</h3>

<script id="movieTemplate" type="text/x-jsrender">

<!-- This thing i want to change dynamically -->

<div>

{{:#index+1}}:<b>{{:Close}}</b> ({{:Open}})

</div>

</script>

<div id="movieList"></div>

<script type="text/javascript">

var movies = [

{ name: "The Red Violin", releaseYear: "1998" },

{ name: "Eyes Wide Shut", releaseYear: "1999" },

{ name: "The Inheritance", releaseYear: "1976" }

];

// Render the template with the movies data and insert

// the rendered HTML under the "movieList" element

$( "#movieList" ).html(

$( "#movieTemplate" ).render( movies )

);

</script>

</body>

</html>

What i need is to change the template at runtime. That is the <div> contents in the <script id=movieTemplate">

Can anybody help me out resolve this issue.

Thanks for sharing your wisdom.

网友答案:

You can download the template for eample via $.getJSON and then do something like

$.getJSON('http://YourServer.com/yourTemplate.txt', function(res) {
$.templates({ tmpl: res });
$("#movieList").html($.render.tmpl(movies ));
});

HTH

相关阅读:
Top