我想用如下.
<script id="movieTemplate" type="text/x-jquery-tmpl">
<tr>
<td>{{=Title}}</td>
<td>
{{* var title = $ctx.GetTitleFunction($view);}}
{{#each Languages}}
<div>
<em>{{=Name}}</em>
<em>({{* title;}})</em>
</div>
{{/each}}
</td>
</tr>
</script>
<script type="text/javascript">
function GetTitle(data){
return "Title : " + data.Title;
}
var movies = [
{
Title: "Meet Joe Black",
Languages: [
{ Name: "English" },
{ Name: "French" }
]
},
{
Title: "Eyes Wide Shut",
Languages: [
{ Name: "French" },
{ Name: "Mandarin" },
{ Name: "Spanish" }
]
}
];
$.views.allowCode = true; …我所有的链接.delete和.editRight添加的模板都在工作.外面所有相同的链接工作得很好.
$(document).ready(function () {
AjaxGetAll();
$(".delete").on("click", function () {
//do stuff
});
$(".editRight").on("click", function () {
//do stuff
});
function AjaxGetAll() {
$.ajax({
success: function (data) {
if (data.hasOwnProperty("d")) {
var favs = data.d;
if (favs.length > 0) {
$("#addedList").html(
$("#addedTemplate").render(favs)
);
}
}
});
}
<script id="addedTemplate" type="text/x-jsrender">
<div class="wrapright">
<a id="editRight_{{>TimePin}}" class="editRight">Edit</a>
<a id="deleteRight_{{>TimePin}}" class="delete">Delete</a>
</div>
我试图从嵌套模板访问父数据.
根据这个https://github.com/BorisMoore/jsrender/issues/34,我试图做类似的事情,但我得到错误:data.parent未定义.
在我的"主"模板中,我有声明
{{for Rooms tmpl="#RoomTmpl" layout=true /}}
并在#RoomTmpl中
<script id="RoomTmpl" type="text/x-jsrender">
{{:parent.data.Room1Label}}
{{for #data}}
{{:RoomName}}
{{/for}}
</script>
我尝试了各种组合但总是出错
{{:parent.parent.data.Room1Label}}
{{:#data.parent.parent.data.Room1Label}}
{{:#data.parent.data.Room1Label}}
{{:#data.parent.Room1Label}}
有谁知道怎么做？
- 解决方案 -
正确的synatx是
#parent.parent.data.Room1Label
我想在yii应用程序上使用jsrender.我需要注册这样的脚本:
<script id="movieTemplate" type="text/x-jsrender">
<div>
{{:#index+1}}: <b>{{:name}}</b> ({{:releaseYear}})
</div>
</script>
通常我使用CClientScript :: registerScript(); 但它不允许指定ID或类型.谁能建议一个干净的方法来做到这一点？
正如标题所说,问题很明显:
在建设中:
{{if is_completed == 1}}
<div>
<p>{{:#parent.parent.data.myproperty}}</p>
</div>
{{/if}}
父属性不可见!
我通过在父循环中创建类似:{{for movies~myproperty = myproperty}}的结构来解决它,并且〜我的属性在IF条件下可见,但如果我有几个变量,如果我有多级嵌套数据结构怎么办？
我有一个select使用jsViews绑定到服务器的某些值.我已成功设法显示选项,但我希望能够跟踪并将select选项设置为我的JavaScript对象中的值.这是我的代码:
<select id="albumChoice" data-link="selectedAlbum">
<option value="-">Please select</option>
{^{for albums}}
<option data-link="{value{:id} text{:name}} selected{:selectedAlbum}}"></option>
{{/for}}
</select>
完整的示例代码就在这个小提琴中:http://jsfiddle.net/4ZevT/
正如您所看到的,我尝试使用选定的{:selectedAlbum},但这并没有做任何事情.我必须做什么,以便在页面加载到服务器的值时自动设置该选项.
我正在尝试使用jquery-mobile listview的autodividersSelector选项,如jquery-mobile文档的List views部分的"Autodividers"部分所述.
这个列表很好,但没有任何分隔符.分配给autodividersSelector的函数永远不会被调用.
这里有一些其他复杂的东西,比如jsrender等等,所以我将它们完好无损,但你会在下面看到它们,我不认为它们是问题的一部分.我错过了什么？
相关代码如下:
<div data-role="page" id="myListPage">
<div data-role="content">
<ul id="myListView"
data-role="listview"
data-autodividers="true"
>
</ul>
</div><!-- /content -->
</div><!-- /page -->
<script type="text/javascript">
$( "#myListPage" ).on("pagebeforecreate", function(event) {
renderTemplates();
});
function renderTemplates() {
var data = {
testItems: [
{name:1},
{name:2},
{name:3},
]
};
$('#myListView').html(
$('#myTemplate').render(data)
);
}
/********** FORMATTING **********/
$("#myListPage").on("pagecreate", function (event) {
console.log("pagecreate");
$("#myListView").listview({
autodividers: true,
autodividersSelector: function (li) {
console.log("autodividersSelector");
var out = "hi"; //var out = $(li).find("h3").text;
return …我是 jsrender 的新手。我已经为一个带有脚本标记的自定义树视图编写了模板，请参见上面：
<script id="jstemplate" type="text/x-jsrender">
{{if IsFolder}}{{include tmpl="#jsfoldertemplate"/}}{{else}}{{include tmpl="#jsfiletemplate"/}}{{/if}}
</script>
<script id="jsfoldertemplate" type="text/x-jsrender">
<li data-jstree='{"type":"{{:ClassName}}"}' data-fold="{{:IsFolder}}" data-path="{{:RP}}">{{:Nom}} <span style="font-size:smaller">({{:Size}} {{:NbFiles}} fichier(s)) <span>{{:Lock}}</span></span>
<ul>
{{for children tmpl="#jstemplate"/}}
</ul>
</li>
</script>
<script id="jsfiletemplate" type="text/x-jsrender">
<li data-jstree='{"type":"{{:ClassName}}"}' data-fold="{{:IsFolder}}" data-path="{{:RP}}">
<span {{:InspectorInfo}} class="SpanEtat {{:Inspector}}"></span>
<span class="ui-link" onclick="$get('<%=Me.ClientID%>').FileSelected('{{:RP}}','{{:Nom}}');" style="vertical-align:middle">{{:Nom}}</span>
<span style="font-size:smaller">({{:Size}} {{:LastModif}}) <span>{{:Lock}}</span></span>
</li>
</script>
在我的 js 代码中：
$(#MyDiv').html('<ul>' + $('#jstemplate').render(NO.Nodes) + '</ul>');
没问题
现在我想把这个模板放在一个字符串中（用于编写 jqm 小部件），但我对子模板变得疯狂......
我尝试了很多解决方案但没有任何效果......
如果有人有任何想法......？
谢谢
我有一些动态数据加载到名为"tabNames"的数组中,如下所示:
tabNames.push({name: hit.category});
然后我需要列出以下html中的"名称"字段.我想在数组"tabNames"中水平列出前7个"name"值,然后将其他值列入下拉列表中.
这是我的HTML
<div id="categories" class="food-category-tab">
<script id="categoriesList" type="text/x-jsrender">
<ul id="myTab" class="nav nav-tabs">
{{if #index <=6}}
<li class="active"><a href="#home" data-toggle="tab">{{>name}} </a></li>
{{/if}}
{{if #index >6}}
<li class="dropdown"> <a href="#" class="dropdown-toggle" data-toggle="dropdown">More <b class="caret"></b></a>
<ul class="dropdown-menu">
<li><a href="#dropdown1" data-toggle="tab">{{>name}}</a></li>
</ul>
</li>
{{/if}}
</ul>
</script>
</div>
我从js文件调用jsrender,其中编写函数用于将内容加载到"tabNames"数组中,如下所示:
$("#categories").html($("#categoriesList").render(tabNames));
任何人都可以告诉代码有什么问题以及如何解决这个问题？