DataTable (jquery): Identificar coluna e obter valores da Data Table

Publicado: julho 29, 2013 em Sem categoria

Este post descreve como criar uma DataTable (jquery) onde é possível identificar a coluna que o usuário clicou e identificar a ação que foi escolhida.

A partir do click do usuário a DataTable irá identificar a ação, por exemplo alterar, e irá chamar o formulário de alteração populando o formulário conforme o registro clicado.

imagem1

 


<script type="text/javascript">

$(document).ready(function ()
 {
 oTable = $('#dt_tabela').dataTable({
 "bProcessing": true,
 "bServerSide": true,
 "bDestroy": true,
 "bSort": true,
 "sAjaxSource": "/Usuario/ListarUsuario",
 "sPaginationType": "bootstrap",
 "aoColumns": [
 { "bSortable": true },
 { "bSortable": true },
 { "bSortable": false },
 { "bSortable": false },
 { "bSortable": false }
 ]
 });

$('body').on('click', '#dt_tabela tbody td', function () {
 /*Obtém a posição da célula clicada */
 var aPos = oTable.fnGetPosition(this);

/*Obtém o array com os dados da linha clicada*/
 var aData = oTable.fnGetData(aPos[0]);

if (aPos[1] == 2) {
 alert('ALTERAR');
 $("#dialog-formulario-alterar-usuario").dialog("open");
 $("#txtAltNome").val(aData[0]);
 }

 if (aPos[1] == 3) {
 alert('Excluir');
 }

 if (aPos[1] == 4)
 alert('Detalhes');

 aData[aPos[1]] = 'Clicked';
 this.innerHTML = 'Clicked';
 });
 });
 </script>

Anúncios

Deixe um comentário

Preencha os seus dados abaixo ou clique em um ícone para log in:

Logotipo do WordPress.com

Você está comentando utilizando sua conta WordPress.com. Sair / Alterar )

Imagem do Twitter

Você está comentando utilizando sua conta Twitter. Sair / Alterar )

Foto do Facebook

Você está comentando utilizando sua conta Facebook. Sair / Alterar )

Foto do Google+

Você está comentando utilizando sua conta Google+. Sair / Alterar )

Conectando a %s