2011-05-12 75 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