Ir para conteúdo

POWERED BY:

Arquivado

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

studiopontocom

[Resolvido] Autoloading de Comboboxs

Por , em Javascript

Recommended Posts

studiopontocom    0

studiopontocom
Postado

Salve Pessoas!

 

Estou adaptando o código "Autoloading de Comboboxs" (Thiago Ferreira - tmferreira.com.br/blog).

 

Quero fazer o seguinte:

 

-Abrir uma janela POPUP...(Nesta janela está o cod. do Thiago)

-Selecionar uma classe, que seleciona uma subclasse...

-Com esses dados, classe e subclasse, fazer uma busca no bd...

-Pegar o resultado da busca, um número, incrementa-lo...

-Passar esse número para a página PAI de onde originou o POPUP.

 

Segue os cod. usados:

 

 

Página PAI.

<html> <head> 	<title>index</title> <script language="JavaScript"> function lancarSubmenu(){    window.open("popup.php","janela1","width=400,height=400,scrollbars=YES") } </script> </head> <body bgcolor="#ffffff"> <form name="form1"> <input type="text" name="colorin1" size="12" maxlength="12"><input type="text" name="colorin2" size="12" maxlength="12"><br> <br> <input type="button" value="Lançar sub-menu" onClick="lancarSubmenu()"> </form> </body> </html>

 

Página POPUP:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN"><html><head>	<title>popup.php</title><script type="text/javascript" src="jquery.js"></script><script type="text/javascript" src="jquery.selectCombo.js"></script><script type="text/javascript" src="index.js"></script><script language="JavaScript">function actualizaPadre(){		window.opener.document.form1.colorin1.value = document.f1.paises.value	window.opener.document.form1.colorin2.value = document.f1.estados.value	window.close();}</script></head><body bgcolor="#ffffff" link=000000 alink=000000 vlink=000000>		<div id="geral">			<form name="f1" method="POST" action="">				<fieldset>					<legend>Carregando classes...</legend>					<label for="paises">Classe: </label>					<br />					<select id="paises">						<option value="">-- Selecione uma classe --</option>					<?php						$sql = "select id, nome from classe where id_pai = 1 and ativo = 'S' order by nome";						$con = mysql_connect( "localhost", "root", "XXXX" );						$bd = mysql_select_db( "XXXX", $con );						$query = mysql_query( $sql );						while ( $campos = mysql_fetch_assoc( $query ) ) {							echo "<option value=\"" . $campos["id"] . "\">" . $campos["nome"] . "</option>\n";						}					?>					</select>					<br />					<label for="estados">Subclasse: </label>					<br />					<select id="estados">						<option value="">-- --</option>					</select>					<br />					<label for="cidades">Numpat: </label>					<br />					<select id="cidades">						<option value="">-- --</option>					</select>					<input type="button" name="envia" size="12" maxlength="12" value="Envia" onClick="actualizaPadre();">				</fieldset>			</form>		</div></body></html>

 

Plungin jquery:

/** * selectCombo for jQuery *  * Copyright (c) 2007 Shelane Enos * Dual licensed under the MIT (MIT-LICENSE.txt)  * and GPL (GPL-LICENSE.txt) licenses. * * Initial base logic from Remy Sharp's blog: http://remysharp.com/2007/01/20/auto-populating-select-boxes-using-jquery-ajax/ *    * @example  $('#myselect').selectCombo('myurltoprocess.lasso?additionalparamtoserverifnecessary=myparam', '#mytargetselect', {hidetarget: false}); *  * Option: hidetarget - Allows you to override the default hide behavior if set to false.  Default true will hide your target select and its label until and option from your source select is selected.  Use this if your target select is not empty when the page loads and its values correspond to your default selected of your source select. * * Parameter sent to server is q * * Expected server response is JSON in this format: [{oV: 'myfirstvalue', oT: 'myfirsttext'}, {oV: 'mysecondvalue', oT: 'mysecondtext'}] * */ (function($){$.fn.selectCombo = function(url, target, settings){//, optionsvar defaults = {hidetarget: true};$.extend(defaults, settings);return this.each(function(){//console.log($(this).val());var targetlabel = target.replace(/#/, '');targetlabel = "label[@for='" + targetlabel + "']";if($(this).val() == '' && defaults.hidetarget){	$(targetlabel).hide();	$(target).hide();	var targetOption = $("option:first", target);}$(this).change(function(){	$.getJSON(url,{q: $(this).val()}, function(j){		var options = '';		for (var i = 0; i < j.length; i++) {			options += '<option value="' + j[i].oV + '">' + j[i].oT + '</option>';		}		$(target).html(options);		$("option:first", target).attr("selected","selected");		//a linha abaixo foi acrescentada por tmferreira!!!		$(target).change();		//fim do acr?scimo		$(targetlabel).show();		$(target).show();	});//end JSON});//end change fn});//end return for each}})(jQuery);

 

Index.js

$(document).ready(function() {	$("#paises").selectCombo("busca.php", "#estados");	$("#estados").selectCombo("busca_num.php", "#cidades");});

Página busca:

<?phpheader("Content-Type: text/html; charset=ISO-8859-1",true);$q = ( isset( $_GET["q"] ) ) ? $_GET["q"] : false;if ( !$q ) {	echo "[{oV: '0', oT: 'Ocorreu um erro. Tente novamente.'}]";}$sql = "select id, nome from classe where id_pai = $q and ativo = 'S' order by nome";$con = mysql_connect( "localhost", "root", "XXXX" );$bd = mysql_select_db( "XXXX", $con );$query = mysql_query( $sql );$retorno = "[";while ( $campos = mysql_fetch_assoc( $query ) ) {	$retorno .= "{oV: " . $campos["id"] . ", oT: '" . $campos["nome"] . "'},";}$retorno = substr( $retorno, 0, strlen( $retorno ) - 1 ) . "]";if ( strlen( $retorno ) == 1 ) {	echo "[{oV: '0', oT: 'Ocorreu um erro. Tente novamente.'}]";}echo $retorno;?>

Obrigado pela atenção.

Compartilhar este post

Link para o post
Compartilhar em outros sites
Ir para a lista de tópicos Javascript
×

Informação importante

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

  Aceito