jquery - How to return a string rendered from an html template using javascript? -
i have javascript function below
function format(d) { // `d` original data object row return '<div class="expandedrow" style="padding: 10px; border-style: solid; border-width: 0px 1px; border-color: #f0f0f0;">' + '<table cellpadding="5" cellspacing="0" border="0" style="width: 100%;">' + '<tr>' + '<td>full name:</td>' + '<td>' + d.name + '</td>' + '</tr>' + '<tr>' + '<td>extension number:</td>' + '<td>' + d.extn + '</td>' + '</tr>' + '<tr>' + '<td>extra info:</td>' + '<td>and further details here (images etc)...</td>' + '</tr>' + '</table>'+ '<div>'; }
clearly returns string
. html template gets more complicated hard put in return statement.
is there way can have template in html file ( template.html
) , render template parameter 'd
' , return resulting string?
i thinking like
return rendertemplate('template.html', d);
jquery template plugin right job.
you put html template in script block (without quotes example)
<script id="movietemplate" type="text/x-jquery-tmpl"> <li> <b>${name}</b> (${releaseyear}) </li> </script>
and apply data set it.
<script type="text/javascript"> var movies = [ { name: "the red violin", releaseyear: "1998" }, { name: "eyes wide shut", releaseyear: "1999" }, { name: "the inheritance", releaseyear: "1976" } ]; $( "#movietemplate" ).tmpl( movies ) .appendto( "#movielist" ); </script>
Comments
Post a Comment