quinta-feira, 5 de maio de 2011

Apagar linha JavaScript

Irei mostrar como remover linhas de um tabela utilizando JavaScript.
O Java Script já possui um método nativo para remoção de linhas, nosso trabalho se resume em informar de qual tabela queremos remover e qual o índice da linha a ser removida.

Segue a seguir o exemplo de uma função para remoção de uma linha:
<script language="javascript">
        // Função responsável em receber um objeto e extrair as informações necessárias para a remoção da linha.
        function removerLinha(obj) {

                // Capturamos a referência da TR (linha) pai do objeto
                var objTR = obj.parentNode.parentNode;
                // Capturamos a referência da TABLE (tabela) pai da linha
                var objTable = objTR.parentNode;
                // Capturamos o índice da linha
                var indexTR = objTR.rowIndex;
                // Chamamos o método de remoção de linha nativo do JavaScript, passando como parâmetro o índice da linha 
                objTable.deleteRow(indexTR);
                // Exibe uma mensagem de confirmação da remoção
                alert("Remoção Efetuada com Sucesso!!");
         }
</script>

Segue a seguir um exemplo prático de utilização da função para remoção de linha:
<table border="1">
    <tr>
        <td>
            Conteúdo da Primeira Linha   
        </td>
         <td>
             <input type="button" value="Excluir Linha" onClick="removerLinha(this)" />
         </td>
    </tr>
    <tr>
        <td>
            Conteúdo da Segunda Linha
        </td>
        <td>
            <input type="button" value="Excluir Linha" onClick="removerLinha(this)" />
        </td>
    </tr>
</table>



Tags: Remover linhas tabela JavaScript; deleteRow JavaScript;

Um comentário: