JQuery模板填充表問題。需要幫助

我有使用$ .ajax從db來的表數據。數據不是正確的。有人可以修復代碼嗎？JQuery模板填充表問題。需要幫助

這是JavaScript文件

var ReloadGrid = (function(){ 
      $.getJSON("/HeaderMenu/GetHeaderGrid", function(data) { 
       $("#gridTemplate").tmpl(data).appendTo("#mytemp"); 
      }); 
});

下面是MVC3剃刀頁。問題是「mytemp」沒有填充，而是在返回3行的標題頂部顯示列。 num ++不工作不知道在哪裏初始化它需要作爲櫃檯。

<script id="gridTemplate" type="text/x-jquery-tmpl"> 
    <tr class="gridRow"> 
     <td class="numberingTd"> 
      var num = 1; 
      num = num++ 

     </td> 
     <td class="cellTd"> 
      <input id="index" name="index" class="numberField" type="text" value="${IndexOrder}" /> 
     </td> 
     <td class="cellTd">${DisplayName}</td> 
     <td class="cellTd ">${UrlName} Us</td> 
     <td class="cellTd ">${Active}</td> 
    </tr> 

</script> 

<div class="gridDiv"> 
<table class="gridTable" cellspacing="0" cellpadding="0"> 
    <tr class="gridTitleRow"> 
     <td class="numberingTd width36">&nbsp;</td> 

     <td class="iconLink width60">Sort Order</td> 
     <td class="iconLink widthAuto">Display Name</td> 
     <td class="iconLink widthAuto">Url Name</td> 
     <td class="iconLink widthAuto">Active</td> 
    </tr> 
    <span id="mytemp" ></span> 
</table> 
</div>

來源

2011-06-12 Pirzada

計數器應該這樣做，究竟是什麼？你實際上並沒有在任何地方使用它，只是聲明，初始化，立即增加它，然後將它分配給它自己（這當然不是正確的做法）。 – 2011-06-12 19:14:47

@Matt Ball，其實我只是在測試它。我需要櫃檯而不是其價值來使物品獨一無二。我很抱歉在發佈之前沒有清理過代碼。 – Pirzada 2011-06-12 19:40:33

模板應該不包含任何邏輯 - 儘可能讓它們啞。將數字放入傳遞給'.tmpl（）'的數據中。 – 2011-06-12 19:42:47

我不知道該data對象是什麼樣子，但你需要一個num屬性添加到每個元素。假設data是對象的數組，那麼這樣的事情應該工作：

$.getJSON('/HeaderMenu/GetHeaderGrid', function(data) 
{ 
    for (var i=0; i<data.length; i++) 
    { 
     data[i].num = i; 
    } 

    $('#gridTemplate').tmpl(data).appendTo('table.gridTable > tbody'); 
});

由於@Cory指出的那樣，你不應該在表中間的<span>。使用<tbody>。

<table class="gridTable" cellspacing="0" cellpadding="0"> 
    <tbody> 
     <tr class="gridTitleRow"> 
      <td class="numberingTd width36">&nbsp;</td> 
      <td class="iconLink width60">Sort Order</td> 
      <td class="iconLink widthAuto">Display Name</td> 
      <td class="iconLink widthAuto">Url Name</td> 
      <td class="iconLink widthAuto">Active</td> 
     </tr> 
    </tbody> 
</table>

來源

2011-06-13 02:23:20

嘗試在num值傳入模板的設置它代替。

此外，您的table中間不應有span。請使用tbody標籤。

var ReloadGrid = (function(){ 
      $.getJSON("/HeaderMenu/GetHeaderGrid", function(data) { 
       data.num = $('#mytemp tr').length + 1; 
       $("#gridTemplate").tmpl(data).appendTo("#mytemp"); 
      }); 
});

來源

2011-06-12 19:17:08

你的答案是完美的。除了傳遞的num值沒有顯示以外，一切正常。我顯示它像$ {num}，但沒有顯示出來。 – Pirzada 2011-06-12 19:55:52

請幫助我。 $ {num}沒有顯示任何內容。 – Pirzada 2011-06-12 22:19:48

這是因爲它不是每行，而是一個字段 – jgauffin 2011-06-13 06:21:04

您可以將一個函數作爲模板選項：

$('#gridTemplate').tmpl(jsonData, { 
     getIndex: function() { 
      return $.inArray(this.data, jsonData); 
    } 
}).appendTo(".gridTable tbody");

，然後在模板：

<script id="gridTemplate" type="text/x-jquery-tmpl"> 
    <tr class="gridRow"> 
     <td class="numberingTd">${this.getIndex()}</td> 
     <td class="cellTd"> 
      <input id="index" name="index" class="numberField" type="text" value="${IndexOrder}" /> 
     </td> 
     <td class="cellTd">${DisplayName}</td> 
     <td class="cellTd ">${UrlName} Us</td> 
     <td class="cellTd ">${Active}</td> 
    </tr> 
</script>

來源

2011-06-13 06:56:10 jgauffin

JQuery的模板救援...內置功能的做這件事情！

${$index + 1}

來源

2011-12-31 17:20:04 user1011144

JQuery模板填充表問題。需要幫助

回答

相關問題