+7
Ajax e PHP - Carregando dados sem refresh
O resultado desse artigo será algo como a seguinte screenshot. Dois campos de combo, quando o usuário selecionar uma opção do primeiro combo, um código JavaScript irá enviar um pedido para o servidor para listar os valores do segundo combo relacionados à opção selecionada do primeiro combo.
Como estarei mostrando como montar combos dinâmicos, vamos começar criando nossas tabelas e o banco de dados no mySQL.
No código abaixo criamos uma tabela tbl_categorias com 2 campos, codigo e nome o campo codigo é do tipo SMALLINT(3) não nulo, auto increment e chave primária, o campo nome é um tipo VARCHAR(40) e não nulo.
No código abaixo criamos uma tabela tbl_subcategoria com 3 campos, codigo, categoria e nome o campo codigo é do tipo SMALLINT(3) não nulo, auto increment e chave primária,o campo categoria é um tipo SMALLINT(3) e não nulo, o campo nome é um tipo VARCHAR(40) e não nulo.
Como estarei mostrando como montar combos dinâmicos, vamos começar criando nossas tabelas e o banco de dados no mySQL.
No código abaixo criamos uma tabela tbl_categorias com 2 campos, codigo e nome o campo codigo é do tipo SMALLINT(3) não nulo, auto increment e chave primária, o campo nome é um tipo VARCHAR(40) e não nulo.
/* Aqui eu crio o banco de dados de teste caso ele não exista. */ CREATE DATABASE IF NOT EXISTS `teste`; /* Selecionando o banco de dados teste. */ USE `teste`; /* Criando a tabela tbl_categorias. */ DROP TABLE IF EXISTS `tbl_categorias`; CREATE TABLE `tbl_categorias` ( `codigo` smallint(3) NOT NULL auto_increment, `nome` varchar(40) collate latin1_general_ci NOT NULL, PRIMARY KEY (`codigo`) ) ENGINE=MyISAM AUTO_INCREMENT=5 DEFAULT CHARSET=latin1 COLLATE=latin1_general_ci; /* Inserindo dados na tabela tbl_categorias. */ INSERT INTO `tbl_categorias`(`codigo`,`nome`) VALUES (1,'ASP'),(2,'PHP'),(3,'.NET'),(4,'CGI');
No código abaixo criamos uma tabela tbl_subcategoria com 3 campos, codigo, categoria e nome o campo codigo é do tipo SMALLINT(3) não nulo, auto increment e chave primária,o campo categoria é um tipo SMALLINT(3) e não nulo, o campo nome é um tipo VARCHAR(40) e não nulo.
/* Criando a tabela tbl_subcategoria. */ DROP TABLE IF EXISTS `tbl_subcategoria`; CREATE TABLE `tbl_subcategoria` ( `codigo` smallint(3) NOT NULL auto_increment, `categoria` smallint(3) NOT NULL, `nome` varchar(40) collate latin1_general_ci NOT NULL, PRIMARY KEY (`codigo`) ) ENGINE=MyISAM AUTO_INCREMENT=17 DEFAULT CHARSET=latin1 COLLATE=latin1_general_ci; /* Inserindo dados na tabela tbl_subcategoria. */ INSERT INTO `tbl_subcategoria`(`codigo`,`categoria`,`nome`) VALUES (1,2,'Chat'),(2,3,'Formulários'),(3,1,'Data/Hora'),(4,1,'Contador'),(5,2,'Fórum'),(6,4,'Calendário'),(7,4,'E-Commerce'),(8,1,'Galeria Imagem'),(9,3,'Help'),(10,2,'Portal'),(11,3,'Contato'),(12,4,'Banner Rotativo'),(13,3,'Busca'),(14,1,'Blog'),(15,2,'Classificados'),(16,4,'Guestbooks');
Comentários:
Mostrando 1 - 9 de 9 comentários
a primeira parte eu segui como seu exemplo mostra
17/06/2011 2:43pm
(~13 anos atrás)
como eu faço para colcoar mais campos no caso estou fazendo um buscador de pneus... segue o link www.tkpneus.com.br/index1.php
17/06/2011 2:42pm
(~13 anos atrás)
Rogério,
Você teria que colocar os dados na SESSÃO, ou colocar algum marcador assim como o google faz http://url.com/pagina.php?teste=a#marcador.
Você teria que colocar os dados na SESSÃO, ou colocar algum marcador assim como o google faz http://url.com/pagina.php?teste=a#marcador.
30/11/2009 3:06pm
(~14 anos atrás)
Existe alguma maneira de o botão "Anterior" do browser funcionar com ajax?
30/11/2009 3:00pm
(~14 anos atrás)
como criar sistema de comentario sem refresh para enviar sem refresh para receber os dados do BD
24/08/2009 7:59pm
(~14 anos atrás)
codigo perfeito nada a reclamar facil em tudo bem didatico.
Continue assim...
Continue assim...
23/07/2009 7:46pm
(~14 anos atrás)
Olá ...
Cara magnifico esse artigo ...
Só uma Duvida que me ocorreu ...
E a conexão do Banco quando é fechada ?
Cara magnifico esse artigo ...
Só uma Duvida que me ocorreu ...
E a conexão do Banco quando é fechada ?
04/06/2009 3:37pm
(~15 anos atrás)
O artigo esta ótimo, porém os códigos estão cheio de comentários que acaba atrapalhando a leitura do mesmo. Procure, falar do código no texto do artigo ao invés de encher de comentários. Abração!
01/06/2009 2:20pm
(~15 anos atrás)