2011-05-12 133 views
0

我需要自動隱藏/刪除已刪除記錄的錶行的解決方案。DOM和jquery對象表示法比較

假設id爲「TBODY」和錶行(TR)與記錄ID的表身元素:

<table> 
<tbody id="tbody"> 
@foreach (var user in Model) { 

    <tr id="@user.ID"> 
     <td>@user.ID</td> 
     <td>@user.FullName</td> 
    </tr>   
} 
    </tbody> 
</table> 

這裏是更新在同一個表的新行的代碼,但我的問題是如何刪除/隱藏行:

$.ajax({ 
     url: '/Controller/Action', 
     type: 'post', 
     success: function (result) 
     { 
      if (result.length >= $('#tbody').find('tr').length) 
      { 
       $.each(result, function (i, v) 
       { 
        if (!$('tbody tr#' + v.ID).length) 
        { 
         $('# tbody').append( 
           '<tr id="' + v.ID + '">' 
          + '<td>' + v.FullName + '</td>' 
          + '</tr>'); 
        } 
       }); 
      } 
      else 
      { 
     /* 
      It seems that one or more records in the 'result' object 
      is deleted/removed. 

      Compare table rows and the 'result' object’s records. 
      Delete/hide all rows that are not found/matched in 'result' object. 
     */ 

      } 
     } 
    }); 

我希望把一些代碼在「其他」塊來隱藏現在不存在於「結果」對象的行。

和對象我打電話看起來像這樣:

var result = new 
{ 
    ID = 1, 
    FullName = "Muaz Khan" 
}; 

我自己嘗試以下技術來隱藏已刪除的記錄行:

else { 
    $.each(result, function (i, v) 
     { 
      if ($('#tbody tr#' + v.ID).length) // if exist 
      { 
        $('#tbody tr#' + v.ID).addClass('not-deleted'); 
      } 
      // hide all rows with no class: 'not-deleted' 
     // $(‘#tbodytr’).notHasClass(‘not-deleted’).hide(); 
     }); 
} 

沒有方法「notHasClass」。這也不是很好的解決方法。

我也玩過很多jquery選擇器,如:not()等,但徒勞無功。我也無法利用hasClass()jquery方法。

因此最後一個解決方法是顯示錨點鏈接或按鈕元素並提示最終用戶單擊以刷新整個表格行。這太糟糕了。我需要解決方案來自動隱藏已刪除記錄的行。

另外,請記住,我不想刷新整個表格。如果您有其他選擇,那麼使用DOM來玩遊戲太糟糕了![輸入圖片說明] [1]

您可以讓我知道如何刪除適當的表格行;被刪除記錄的表格行。

回答

0

您應該使用jQuery remove方法刪除特定的DOM元素。

$('#tbody tr#' + v.ID).remove(); 

http://api.jquery.com/remove/

+0

如何檢測要刪除的行....這是我的主要問題... – 2011-05-12 09:24:49