带有{^ {if}}的jsviews错误 [英] Possible jsviews bug with {^{if}}
问题描述
在下面的示例中,如果我添加几个来宾,然后删除 1st 来宾,则即使Guest []不为空,整个来宾表也将消失并且不会再出现.这里的{^ {if}}或我的代码有问题吗? (我正在使用提交34)
In the example below, if I add several guests and then remove the 1st guest the entire guest table disappears and never reappears even though the Guest[] in not empty. Is there something wrong with {^{if}} here or my code? (I'm using commit 34)
<div id="frm-reg"></div>
<script id='jsr-registration' type='text/x-jsrender'>
<p><button id="btn-addGuest">Add Guest</button></p>
{^{if Guests.length}}
<table>
<tr>
<th>First Name</th>
<th>Last Name</th>
<th>Age</th>
<th></th>
</tr>
{^{for Guests}}
<tr>
<td><input data-link="FirstName" type="text" /></td>
<td><input data-link="LastName" type="text" /></td>
<td><input data-link="Age" type="text" /></td>
<td><button class="btn-remove">Remove</button></td>
</tr>
{{/for}}
</table>
{{/if}}
</script>
<script>
var model={"CampID":3,"FirstName":"a","LastName":"b","Guests":[]};
$.templates({regTmpl: "#jsr-registration"});
$.link.regTmpl("#frm-reg", model)
.on("click", ".btn-remove", function()
{
$.observable(model.Guests).remove( $.view(this).index, 1 );
return false;
});
$("#btn-addGuest").click(function()
{
$.observable(model.Guests).insert(model.Guests.length, {FirstName:"", LastName:"", Age:""});
return false;
});
</script>
推荐答案
这是在标记中没有<tbody>
标记的结果.
This is the result of not having a <tbody>
tag in the markup.
当在JsRender模板中使用<table>
标记(与JsViews数据绑定一起使用)时,您需要记住始终包含<tbody>
标记.无论如何,浏览器都会插入一个,然后JsViews解析将以不正确的元素深度信息结束.
When you use <table>
tags in JsRender templates, used with JsViews data-binding, you need to remember always to include a <tbody>
tag. The browser will insert one anyway, and JsViews parsing will then end up with incorrect element depth information.
为此,我将在JsViews解析器中添加一条警告错误消息.
I will add a warning error message in the JsViews parser for this.
这篇关于带有{^ {if}}的jsviews错误的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!