更新子模板

Question

我有一个主模板，如：

<script type="text/x-jQuery-tmpl" id="baseTmpl"> 
<tr> 
    <td>${Name}</td> 
    <td> 
     <div id="${ID}"> 
      {{tmpl "#displayTmpl"}} 
     </div> 
    </td> 
</tr> 
</script> 

<script type="text/x-jQuery-tmpl" id="displayTmpl"> 
    <a id="myLink" href="javascript:changeTmpl(${ID})">${Department}</a> 
</script> 

<script type="text/x-jQuery-tmpl" id="editTmpl"> 
    <input type="text" id="text" value="${Department}" /> 
</script> 

<script type="text/javascript"> 
    function changeTmpl(id) { 
     var templateItem = $('#'+id).tmplItem();  
     templateItem.tmpl = editTemplate; 
     templateItem.update(); 
    }; 
</script> 

上面的代码中删除所有的TR数据以及当我更新模板。我想只更新DIV的内容，而不是完整的TR

Answer 1

在基本模板中，ID应该是指TR，而不是DIV

<tr div id="${ID}"> 
.... 
</tr> 

此刻，当你选择VAR templateItem = $（'＃'+ id）.tmplItem（）;它只会拉出div，因为这是id引用的内容。

Answer 2

当你这样做：

var templateItem = $('#'+id).tmplItem(); 

你得到的股利，这实际上是由模板（全<tr>）都呈现相同tmplItem的tmplItem。

您想要访问div内部元素的tmplItem。这将工作：

var templateItem = $('#'+id).children(":first").tmplItem();