[Resolvido] Jump Menu Dinâmico

[formigoni 0]

Olá, boa noite, preciso de uma ajuda para resolver o que pra mim é um problema.

 

Como criar um Jump Menu Dinâmico abrindo o conteúdo em uma DIV?

 

O que tenho atualmente é um link que uso para abrir o conteúdo em uma DIV, vejam:

 

O Javascript

 

	<!-- CARREGA LOJAS PARA CADA MUNICÍPIO -->

show_loading_loja = function () {
	//$("#ajax_loader").fadeIn()
	$("#conteudo_loja").animate({
		'opacity': 'hide'
	}, 'fast')
}

hide_loading_loja = function () {
	//$("#ajax_loader").fadeOut()
	$("#conteudo_loja").animate({
		'opacity': 'show'
	}, 'slow')
}		

carregaLoja = function (pagina) {
	if (pagina != '') {
		show_loading_loja();

		$("#conteudo_loja").load(pagina, function () {
			hide_loading_loja();
		})

		document.body.setAttribute("id", pagina)
	}
}
   </script>

 

PHP que busca lojas pelo IdEstado

 

	// buscando dados da(s) loja(s)
mysql_select_db($database_conexao, $conexao);
$query_lojas = "SELECT * FROM lojas WHERE IdUF = $IdEstado GROUP BY IdMunicipio ORDER BY nome ASC";
$lojas = mysql_query($query_lojas, $conexao) or die(mysql_error());
$row_lojas = mysql_fetch_assoc($lojas);
$totalRows_lojas = mysql_num_rows($lojas);	

 

Abrindo resultado em uma DIV

 

<?php do { ?>
 <table width="50%" border="0">
   <tr>
     <td class="loja"><a href="#" onClick="carregaLoja('mapa.php?IdMunicipio=<?php echo $row_lojas['IdMunicipio']; ?>');"><?php echo $row_lojas['nomeCidade']; ?></a></td>
   </tr>
 </table>
 <?php } while ($row_lojas = mysql_fetch_assoc($lojas)); ?>

 

O que estou precisando é criar um Jump Menu Dinâmico abrindo o que preciso na DIV.

Será que poderiam me ajudar?

 

Valeu e fiquem na paz.

[formigoni 0]

Olá, boa tarde.

Depois de pesquisar um pouco e com a ajuda de alguns amigos consegui resolver o "problema" que tinha.

Vou postar a solução.

 

Criei um JumpMenu com as opções que precisava vindas do banco, vejam:

 

As funções em JS:

 

    <!-- sessão jquery !-->
   <script type="text/javascript" src="js/jquery.js"></script>

<script type="text/javascript">
   function JumpMenu(){ //v3.0
     var id = document.getElementById('jumpMenu').value;
     // alert(id);
     carregaLoja('mapa.php?IdMunicipio='+id);
   }

$(document).ready(function() {
	$('.efeito_fade').append('<span class="hover"></span>').each(function () {
  		var $span = $('> span.hover', this).css('opacity', 0);
  		$(this).hover(function () {
    		$span.stop().fadeTo(500, 1);
 		}, function () {
   	$span.stop().fadeTo(500, 0);
  		});
	});
});

<!-- CARREGA NOME DAS CIDADES ONDE POSSUI LOJAS -->

show_loading = function () {
	$("#ajax_loader").fadeIn()
	$("#conteudo_principal").animate({
		'opacity': 'hide'
	}, 'fast')
}

hide_loading = function () {
	$("#ajax_loader").fadeOut()
	$("#conteudo_principal").animate({
		'opacity': 'show'
	}, 'slow')
}

carregaPagina = function (pagina) {
	if (pagina != '') {
		show_loading();

		$("#conteudo_principal").load(pagina, function () {
			hide_loading();
		})

		document.body.setAttribute("id", pagina)
	}
}

<!-- CARREGA LOJAS PARA CADA MUNICÍPIO -->

show_loading_loja = function () {
	//$("#ajax_loader").fadeIn()
	$("#conteudo_loja").animate({
		'opacity': 'hide'
	}, 'fast')
}

hide_loading_loja = function () {
	//$("#ajax_loader").fadeOut()
	$("#conteudo_loja").animate({
		'opacity': 'show'
	}, 'slow')
}		

carregaLoja = function (pagina) {
	if (pagina != '') {
		show_loading_loja();

		$("#conteudo_loja").load(pagina, function () {
			hide_loading_loja();
		})

		document.body.setAttribute("id", pagina)
	}
}
   </script>

 

O formulário JumpMenu criado dinâmicamente:

 

<form name="form" id="form">
 <select name="jumpMenu" id="jumpMenu" onchange="JumpMenu()">
   <?php
do {  
?>
   <option value="<?php echo $row_lojas['IdMunicipio']?>"><?php echo $row_lojas['nomeCidade']?></option>
   <?php
} while ($row_lojas = mysql_fetch_assoc($lojas));
 $rows = mysql_num_rows($lojas);
 if($rows > 0) {
     mysql_data_seek($lojas, 0);
  $row_lojas = mysql_fetch_assoc($lojas);
 }
?>
 </select>
</form>

 

 

 

E ai está, funcionando.

Valeu e fiquem na paz.