Ir para conteúdo

POWERED BY:

Arquivado

Este tópico foi arquivado e está fechado para novas respostas.

celsomtrindade

AJAX adicionar/deletar itens de uma tabela com ajax e json

Recommended Posts

E ai pessoal, tudo certo?

Bom, ainda sou novato com ajax (tenho um pouco de base de jquery já) e estou montando uma área administrativa onde possuo uma tabela.
Os dados dessa tabela são obtidas através de um array do json.

Minhas dúvidas são:

  • Como eu faço para adicionar uma nova linha na tabela? No caso, um novo cadastro.
  • Como faço para excluir algum cadastro da tabela?
  • Como posso deixar tudo mais dinâmico? atualizando somente a tabela em tempo real e não toda a página.

Estive buscando algo a respeito, mas encontrei apenas os docs do próprio jquery, o que ficou meio amplo e vago, difícil de juntar as peças para um iniciante como eu.
Mas o que eu tenho por base até o momento vou descrever abaixo e espero que vocês possam confirmar, negar ou me guiar pelo melhor caminho para obter os resultados.

1- posso fazer isso através do método POST, com um script php externo.
Exemplo:
Ajax=

$('form').submit (function(evt) {
	evt.preventDefault();
	var url = "script/cadastra.php";
	var formData = $(this).serialize();
	$.ajax(url, {
		data: formData,
		type: "POST",
		success: function (response) {
			$('#result').html("<p>Cadastrado com sucesso</p>")
		}
	}); //end post
}).fail(function (jqXHR) {
	var error = "<p> Ops, algo deu errado.</p>";
	$('#diverror').html(error);
}); //end submit

PHP (algum código +- assim)=

if(!empty($_POST['jur'])){
	sql("insert into cad_cliente (cod, nm_cliente, razao_social ...)");
}

*Complementado com o restante dos códigos de php de conexão, etc..

------------------------------------------------------------------------------------------------------

2- Para excluir algum cadastro.
Vi que no AJAX existe um método chamado DELETE que poderia ser usado para esta tarefa, porém não consegui juntar muito bem a teoria com a prática.
​O que eu acabei encontrando foi que poderíamos ter algo assim no AJAX


$(".bt_delete").click(function() {
	$.ajax({
		url: 'script/deleta.php',
		type: 'DELETE',
		success: function(data) {     
			//play with data 
		}
	});
});

Com um script externo agindo para fazer a exclusão do banco de dados.
------------------------------------------------------------------------------------------------------

3- E por fim, uma dúvida que ainda não consegui encontrar uma resposta, nem alguma direção, por menor que seja.
Como fazer para que a tabela se atualize automaticamente após alguma dessas 2 modificações? Exclusão/Adição.

Sei que é possível, porém não sei como obter esse resultado ainda.
Espero que alguém possa me ajudar.

Desde já agradeço.
Obrigado!

Compartilhar este post


Link para o post
Compartilhar em outros sites

1 e 2 já estão respondidas então ?

 

3.

		success: function(data) {     
			//play with data 
		}
ali naquele //play with data, é onde vc deverá atualizar a tabela.

Nesse caso, para a exclusão vc remove do html a linha da tabela com um $element.remove()

 

Para a inclusão, vc faz um .append() ali..

Compartilhar este post


Link para o post
Compartilhar em outros sites

 

Ok, vou tentar com essa solução para ver o que consigo fazer.

No momento não consegui um teste completo pois ainda estou com problemas na hora de gerar o json com o php.

Como já disse, sou novo nisso, ainda não consegui essa etapa.

Compartilhar este post


Link para o post
Compartilhar em outros sites

×

Informação importante

Ao usar o fórum, você concorda com nossos Termos e condições.