CODEWITHSUNDEEP
jqueryasp.nethtml-table
Marc
Marc

Reputation: 16512

How to remove all rows of the table but keep the header

I want to remove all rows of my table except the header.

This is what I've tried but it always deletes all rows and header:

$("#<%=tblDetailFourn.ClientID%> tbody tr").remove();

$("#<%=tblDetailFourn.ClientID%> tbody tr").not("thead tr").remove();

$("#<%=tblDetailFourn.ClientID%> tr").not("thead tr").remove();

$("#<%=tblDetailFourn.ClientID%> tbody").not("thead").remove();

$("#<%=tblDetailFourn.ClientID%> tbody").remove();

$("#<%=tblDetailFourn.ClientID%> > tbody").remove();

Here's the html:

<table id="tblDetailFourn" runat="server" class="ProjetTable ProjetTableHover">
    <thead>
       <tr>
          <th style="width:200px">Rôle de Ressource</th>
          <th style="width:200px">Nom Prénom</th>
          <th style="width:120px">Tel</th>
          <th style="width:200px">Courriel</th>
          <th style="width:80px">Actif</th>
          <th style="width:33px"></th>
          <th style="width:33px"></th>
      </tr>
    </thead>
    <tbody>
    </tbody>
</table>

Upvotes: 19

Views: 74403

Answers (9)

Sachin Gupta
Sachin Gupta

Reputation: 74

if you want to delete all the tbody including the tag then use 

$("#tblDetailFourn tbody").remove();

it will remove all the tr under the tbody as well as tbody.

Upvotes: 0

GuestFirstPost
GuestFirstPost

Reputation: 1

$('#tblDetailFourn > tbody > tr > td').parent('tr').empty();

Upvotes: 0

Md. Russel Hussain
Md. Russel Hussain

Reputation: 51

Based on the html you provided the solution is following

$("#tblDetailFourn tbody").empty();

This will work perfectly.

Thanks

Upvotes: 2

Thierry Blais
Thierry Blais

Reputation: 2858

Try using this:

$('#<%=tblDetailFourn.ClientID%> tr').not(function(){ return !!$(this).has('th').length; }).remove();

Upvotes: 11

Jorge
Jorge

Reputation: 821

$('#tblDetailFourn tbody').empty();

Upvotes: 53

Michal Borek
Michal Borek

Reputation: 4624

Have you tried this?:

$("#<%=tblDetailFourn.ClientID%> tbody").html('')

Upvotes: 3

SenorAmor
SenorAmor

Reputation: 3345

What about:

$('#tblDetailFourn tbody').html('');

jsfiddle

Upvotes: 5

Brian Mains
Brian Mains

Reputation: 50728

Try http://api.jquery.com/child-selector/

$("#<%=tblDetailFourn.ClientID%> > tbody > tr").remove();

What you have should work though.

Upvotes: 11

jrummell
jrummell

Reputation: 43077

This should work, assuming that you don't have any header elements in tbody.

$("#<%=tblDetailFourn.ClientID%> tbody tr").remove();

Upvotes: 4

Related Questions