Populando ComboBox no Flash com PHP, MySQL e XML
Posted by Andrews on fevereiro 5th, 2009Tenho estudado muito nos últimos dias, afinal quem trabalha nesta área tem de estar em aprendizado constante. Estou iniciando meus estudos em OOP no PHP e também aprofundando meu conhecimento no Adobe Flex, e tenho progredido bastante neste período.
Mas brother, vamos ao que interessa para este post, acabei escrevendo um código utilizando PHP e MySQL, onde o PHP gera um XML através de uma consulta na tabela para alimentar um ComboBox Component no Flash.
Alimentar um ComboBox é simples, mas resolvi que iremos alimetar dois ComboBox, onde, um irá alimentar o outro, utilizarei os estados do Brasil e suas cidades como exemplo.
1ª Etapa:
Aqui, definiremos nossas tabelas no MySQL.
Tabela estado
CREATE TABLE `estado` ( `est_codigo` int(2) NOT NULL auto_increment, `est_nome` varchar(50), PRIMARY KEY (`est_codigo`) ) insert into `estado`(`est_codigo`,`est_nome`) values (1,'Santa Catarina'), (2,'Paraná'), (3,'Rio Grande do Sul'), (4,'São Paulo'), (5,'Rio de Janeiro');
Tabela cidade
CREATE TABLE `cidade` ( `cid_codigo` int(5) NOT NULL auto_increment, `cid_est_codigo` int(2) default NULL, `cid_nome` varchar(70) default NULL, PRIMARY KEY (`cid_codigo`) ) insert into `cidade`(`cid_codigo`,`cid_est_codigo`,`cid_nome`) values (1,1,'Porto União'), (2,1,'Canoinhas'), (3,1,'Balneário Camboriú'), (4,1,'Caçador'), (5,1,'Florianópolis'), (6,2,'Curitiba'), (7,2,'União da Vitória'), (8,2,'Foz do Iguaçu'), (9,3,'Porto Alegre'), (10,3,'Canoas'), (11,3,'Caxias do Sul'), (12,4,'São Paulo'), (13,4,'Campinas'), (14,4,'Santos'), (15,4,'Ubatuba'), (16,5,'Rio de Janeiro'), (17,5,'Angra dos Reis'), (18,5,'Paraty');
2ª Etapa:
Precisaremos de uma conexão com nosso banco de dados, caso ja tenha ou saiba como criar uma pode passar para a próxima etapa.
Crie um novo arquivo PHP e salve-o com o nome de Conexao.php então escreveremos a classe Conexao.
<?php class Conexao { // CONSTRUTOR function __construct() { return true; } /** * FUNCTION CONEXAO * @return $cnx */ function conectar() { $sHost = 'nome-do-host'; $sDB = 'nome-do-db'; $sUser = 'nome-do-user-mysql'; $sPassword = 'senha-do-usuer'; $cnx = mysql_connect($sHost, $sUser, $sPassword); mysql_select_db($sDB, $cnx); return $cnx; } } ?>
3ª Etapa
Nesta etapa definiremos as classes que irão gerar o XML para alimentar o ComboBox de estados que por sua vez irá alimentar o ComboBox de cidades.
Então crie um arquivo PHP chamado Estado.php e escreva a classe abaixo.
<?php // INFORMAMOS QUE O DOCUMENTO SERA DO TIPO XML header("Content-Type: text/xml; charset=UTF-8", true); // CONEXAO require_once('Conexao.php'); // CLASS ESTADO class Estado { // CONSTRUTOR function __construct() { return true; } /** * FUNCTION getEstado * @return xml */ function getEstado() { // CONEXAO $conexao = new Conexao(); $cnx = $conexao->conectar(); // SELECIONA ESTADO NO DB $sSQL = "SELECT est_codigo, est_nome FROM estado ORDER BY est_nome ASC"; $qSQL = mysql_query($sSQL, $cnx) or die(mysql_error()); // GERANDO XML echo "<?xml version='1.0' encoding='UTF-8'?> "; echo "<estados>"; while( $aRow = mysql_fetch_array($qSQL) ) { echo "<estado>"; echo "<codigo><![CDATA[" . $aRow['est_codigo'] . "]]></codigo>"; echo "<nome><![CDATA[" . $aRow['est_nome'] . "]]></nome>"; echo "</estado>"; }; echo "</estados>"; } } // INICIA CLASSE $estado = new Estado(); echo $estado->getEstado(); ?>
Salve-o, e agora iremos criar a classe que alimentará as cidades.
A Classe de cidades é exibida de forma dinâmica, onde, ao selecionar o estado desejado passaremos o código dele como parametro para consultar somente as cidades que fazem referência a este estado.
Crie um novo arquivo PHP e salve-o como o nome Cidade.php, e escreva a classe para as cidades.
<?php // INFORMAMOS QUE O DOCUMENTO SERA DO TIPO XML header("Content-Type: text/xml; charset=UTF-8", true); // CONEXAO require_once('Conexao.php'); // CLASS CIDADE class Cidade { // CONSTRUTOR function __construct() { return true; } /** * FUNCTION getCidade * @param Number codigo * @return xml */ function getCidade($codigo) { // CONEXAO $conexao = new Conexao(); $cnx = $conexao->conectar(); $nCodigo = $codigo; $sSQL = "SELECT cid_codigo, cid_nome FROM cidade WHERE cid_est_codigo = $nCodigo ORDER BY cid_nome ASC"; $qSQL = mysql_query($sSQL, $cnx) or die(mysql_error()); // GERANDO XML echo "<?xml version='1.0' encoding='UTF-8' ?>"; echo "<cidades>"; while ($aRow = mysql_fetch_array($qSQL)) { echo "<cidade>"; echo "<codigo><![CDATA[" . $aRow['cid_codigo'] . "]]></codigo>"; echo "<cidade><![CDATA[" . $aRow['cid_nome'] . "]]></cidade>"; echo "</cidade>"; } echo "</cidades>"; } } /** * INICIAMOS A CLASSE E PASSAMOS O CODIGO DO * ESTADO COMO PARAMETRO PARA A CONSULTA */ $cidade = new Cidade(); echo $cidade->getCidade($_GET['codigo']); ?>
4ª Etapa
Nesta quarta e última etapa, criaremos e escreveremos nosso arquivo Flash.
Então, crie um novo arquivo Flash, e arraste dois Components ComboBox para o palco, de o nome de instância para eles de estado_cbx e cidade_cbx, também crie um campo de texto dinâmico com o nome de alerta_txt.
Abaixo temos a imagem de como ficará os objetos no palco.

Agora, insira uma nova Layer para que possamos escrever nosso código ActionScript, onde, este por sua vez será o reponsável pelo carregamento e população dos ComboBox.
System.useCodepage = true; /** * FUNCTION getEstado */ getEstado = function() { var xmlEstado:XML = new XML(); xmlEstado.ignoreWhite = true; xmlEstado.load("Estado.php"); xmlEstado.onLoad = function(ok) { if (ok) { var aDados = Array(); var nTotal = this.firstChild.childNodes.length; // PASSANDO DADOS DO XML PARA ARRAY for (var i = 0; i < nTotal; i++) { aNode = this.firstChild.childNodes[i]; aDados[i] = { data:aNode.childNodes[0].firstChild.nodeValue, label:aNode.childNodes[1].firstChild.nodeValue }; } // POPULANDO COMBOBOX COM OS DADOS DO ARRAY estado_cbx.dataProvider = aDados; } }; // LISTENER PARA ESTADO var objEstado:Object = new Object(); objEstado.change = function() { sEstado = estado_cbx.selectedItem.label; nCodigo = estado_cbx.value; alerta_txt.text = sEstado; getCidade(nCodigo); }; estado_cbx.addEventListener("change", objEstado); } getEstado(); /** * FUNCTION getCidade * @param Number nCodigo */ getCidade = function(nCodigo) { var xmlCidade:XML = new XML(); xmlCidade.ignoreWhite = true; xmlCidade.load("Cidade.php?codigo="+nCodigo); xmlCidade.onLoad = function(ok) { if (ok) { var aDados = Array(); var nTotal = this.firstChild.childNodes.length; // PASSANDO DADOS DO XML PARA ARRAY for (var i = 0; i < nTotal; i++) { aNode = this.firstChild.childNodes[i]; aDados[i] = { data:aNode.childNodes[0].firstChild.nodeValue, label:aNode.childNodes[1].firstChild.nodeValue }; } // POPULANDO COMBOBOX COM DADOS DO ARRAY cidade_cbx.dataProvider = aDados; } } // LISTENER PARA CIDADE var objCidade:Object = new Object(); objCidade.change = function() { sEstado = estado_cbx.selectedItem.label; sCidade = cidade_cbx.selectedItem.label; alerta_txt.text = sCidade + " - " + sEstado; }; cidade_cbx.addEventListener("change", objCidade); }
Agora, salve o arquivo Flash com qualquer nome, compile e teste-o.
Prontinho, nosso trabalho está feito, e com a certeza de que tiraremos bastante proveito dele.
O post ficou grande, porém tenho a certeza de que estou progredindo em meus estudos e em meu conhecimento também, e assim espero repassar o pouco do que estou aprendendo com os demais, pois, como nossa areá vive em constante apredizado e nem todos tem a oportunidade de estar aprendendo em uma sala de aula fica ai então a pequena contribuição.
Clique aqui e veja como ficou nossa pequena aplicação
Macanudo, finalizo este post ao som de Chromophobia, Gui Boratto. d(-_-)b
Comentários recentes