jQuery Templating不会更新/刷新?

时间:2011-05-09 21:22:37

标签: jquery jquery-templates

出于某种原因,我过滤后似乎无法让我的模板更新?我的过滤工作,但由于某种原因模板不会更新?有什么想法吗?

这是一个jsfiddle链接,显示我遇到的问题。这不是确切的,但它得到了重点。 jsfiddle

只是另一个编辑。当我手动发送一个对象数组而不是测试时,它工作正常吗?例如

不起作用:

$.tmpl(summaryTemplate, test).appendTo("#buildings");  

使用:

$.tmpl(summaryTemplate, [{"Device" : "Device11"}, {"Device" : "Device12"}]).appendTo("#buildings");   <---works


 <script type="text/javascript">
  var buildings = [];
  $.template( "summaryTemplate", $('#summaryTemplate'));
  $(function () {
    var xhr = $.getJSON('/GetBuildings', { id: 4 });
    xhr.success(function(data) { 
      buildings = data;
      $.tmpl(summaryTemplate, buildings).appendTo( "#buildings" );
    });


    $('#device').keyup(function() {
      var text = this.value;
      var test = $(buildings).filter(function() {
        return (this.Device.toLowerCase().indexOf(text.toLowerCase()) != -1);
      });
        $('#buildingCount').text(test.length);
       $.tmpl(summaryTemplate, test).appendTo("#buildings");
    });
  });

</script>
<script id="summaryTemplate" type="text/x-jquery-tmpl">
  <li class="device">
    ${Device}
    <div style="display: none;">
      <div class="slider">
        <div>
          <span>Building: </span><span><b>${Building}</b></span>&nbsp; &nbsp;<span>Room:
          </span><span><b>${Room}</b></span></div>
        <div>
          <span>Building Access: </span><span><b>${BuildingAccess}</b></span>&nbsp;
          &nbsp;<span>Room Access: </span><span><b>${RoomAccess}</b></span></div>
        <div>
          <span>Access Type: </span><span><b>${AccessType}</b></span>&nbsp; &nbsp;<span>After
            Hours: </span><span><b>${AfterHours}</b></span></div>
        <div>
          <span>Notes: </span><span><b>${Notes}</b></span></div>
      </div>
    </div>
  </li>
</script>

1 个答案:

答案 0 :(得分:0)

经过一段时间的努力,我终于明白了。 .filter()方法返回一个jquery对象。我必须在将它发送到模板时执行test.toArray(),并且一切都按预期工作。