0

Tenho uma tabela com diversos elementos (parceiros), e preciso fazer o botão de excluir funcionar. Mas sempre que coloco o evento o botão ele apaga todos os elementos e não apenas a linha que desejo.

<table id="parceiro" class="table table-bordered table-striped">
                            <thead>
                            <tr>

                                <th># ID</th>
                                <th><i class="fa fa-user-o"></i> Nome Usuário</th>
                                <th><i class="fa fa-group"></i> Perfil</th>
                                <th><i class="fa fa-sitemap"></i> Vínculo</th>
                                <th><i class="fa fa-envelope-open"></i> E-mail </th>
                                <th><i class="fa fa-phone"></i> Telefone</th>
                                <th><i class="fa fa-gears"></i> Ações</th>
                            </tr>
                            </thead>
                            <tbody>
                            <tr class="parceiro">
                                <td>001</td>
                                <td>Marcus Vinicius de Carvalho Botelho</td>
                                <td>Administrador</td>
                                <td></td>
                                <td>[email protected]</td>
                                <td>(85) 3275-2244</td>
                                <td>
                                    <button class="btn btn-info"><i class="fa fa-pencil"></i> Editar</button>
                                    <button class="btn btn-danger excluir"><i class="fa fa-trash-o"></i> Excluir</button>
                                </td>
                            </tr>
                            <tr class="parceiro">
                                <td>002</td>
                                <td>João Carlos Crispin</td>
                                <td>Parceiro</td>
                                <td>Café do João</td>
                                <td>[email protected]</td>
                                <td>(85) 3271-5533</td>
                                <td>
                                    <button class="btn btn-info"><i class="fa fa-pencil"></i> Editar</button>
                                    <button class="btn btn-danger excluir"><i class="fa fa-trash-o"></i> Excluir</button>
                                </td>
                            </tr>
                            <tr class="parceiro">
                                <td>003</td>
                                <td>João Carlos Crispin</td>
                                <td>Parceiro</td>
                                <td></td>
                                <td>[email protected]</td>
                                <td>(85) 3271-5533</td>
                                <td>
                                    <button class="btn btn-info"><i class="fa fa-pencil"></i> Editar</button>
                                    <button class="btn btn-danger excluir"><i class="fa fa-trash-o"></i> Excluir</button>
                                </td>
                            </tr></table>

Estou usando o seguinte código para excluir

$( "button.excluir" ).click(function() {
        $( "tr.parceiro" ).remove();
    });

1 Resposta 1

1

Trabalhe com o $(this) para remover a linha da seguinte forma, vamos pegar em qual botão está sendo disparado o evento com o this e vamos subir dois niveis(nivel da linha) com o parent(), ai sim removeremos apenas a linha:

<script>
    $( "button.excluir" ).click(function() {
        $(this).parent().parent().remove();
    });
</script>
1
  • Muito obrigado! Resolveu meu problema. Commented 5/12/2017 às 13:36

Você deve fazer log-in para responder a esta pergunta.

Esta não é a resposta que você está procurando? Pesquise outras perguntas com a tag .