Abrir um select em uma Lightbox com resultados em vários checkboxs

[Jeovane Carvalho 6]

Olá pessoal, depois de recorrer à todos os fóruns , não consegui achar um exemplo do que eu quero, por se tratar de tecnologia mais atual, preciso que um resultado de uma combo box abra numa lightbox ou uma janela modal . eu cheguei a montar meu select com java e php , mas não estou conseguindo jogar o último resultado que seria bairros dentro do value vejam meus scripts com que estou quebrando a cabeça a semanas:

 

O 1º seria o arquivo onde contém o form junto com o java script que segue abaixo:

<?php
//CONECTA AO MYSQL                     
include_once("config.php");   
include_once("combo_cidades.php");          

?>


<script type="text/javascript">
function validarform(formulario){
if(formulario.negocio_.value == ''){
alert("O campo Finalidade é obrigatório.");
formulario.negocio_.focus()
return false;
}
if(formulario.ct_tipo_ .value == ''){
alert("O campo Tipo é obrigatório.");
formulario.ct_tipo_ .focus()
return false;
}
if(formulario.cidade_ .value == ''){
alert("O campo Cidade é obrigatório.");
formulario.cidade_ .focus()
return false;
}
if(formulario.bairro_.value == ''){
alert("O campo Bairro é obrigatório.");
formulario.bairro_.focus()
return false;
}
return true;
}
</script>


<div class="pagination_form">
<ul>
<li><a href="#" id="prev" class="prevnext">Busca por Cidade</a></li>
<li><a href="#" id="next" class="prevnext">Busca por Codigo</a></li>
</ul>
<br />
</div>
<div id="content">
<div><form name="busca" id="busca"  onsubmit="return validarform(this);"  method="post" action="busca-de-imoveis" enctype="multipart/form-data">


<fieldset><div class="search-property__search-box search-box"><div class="search-box__column search-box--action">

<select name="negocio_" id="negocio_"  class="search-box__combo">
<option value="" >Finalidade</option>
<?php
$sql = $MySQLi->query("SELECT id, tipo FROM negocio_tipo WHERE ativo='S'");
while( $linha = mysqli_fetch_array($sql)){
echo '<option class="item" value="'.$linha['id'].'">'.$linha['tipo'].'</option>';
}
?>
</select></div>

<div class="search-box__column search-box--what">
<select name="tipo_" id="tipo_"  class="search-box__combo">
<option value="">Tipo</option>
<optgroup label="Residencial">

<?php
$sql = $MySQLi->query("SELECT id, tipo_nome FROM imoveis_tipo WHERE ativo='1'");
while( $linha = mysqli_fetch_array( $sql ) ) {
echo '<option value="'.$linha['id'].'">'.$linha['tipo_nome'].'</option>';
}
?>

</optgroup>
</select>

</div>





<div class="search-box__column search-box--what">
<select name="cidade_" id="cidade_" onChange="valor(this.value);" class="search-box__combo">
<option value="todos">Cidades</option>
<optgroup label="Cidades">

<?php
$sql = $MySQLi->query("SELECT id, cidade, uf FROM cidades ORDER BY cidade ASC");
while( $linha_1 = mysqli_fetch_array( $sql ) )

echo '<option value="'.$linha_1['id'].'">' . $linha_1['cidade'] .' / '.$linha_1['uf'].'</option>';

?>

</optgroup>
</select>

</div>


<div class="search-box__column search-box--what">
<select name="bairro_"  id="bairro_" class="search-box__combo">
<option value="" id="opcoes">Bairro</option>
<optgroup label="Bairros">
</optgroup>
</select>

</div>



<div class="search-box__full search-box--now">
<input type="submit" class="icon-search search-property__button"  id="btnEnviar" value="Buscar"/>
</div>
</div>
</fieldset>
</div>





<div class="ocultar">


<fieldset><div class="search-property__search-box search-box"><div class="search-box__column search-box--action">
</div>

<div class="search-box__full search-box--now"></div>

<div class="search-box__full search-box--where">
<input type="text" name="cod" id="cod"  class="search-box__input" placeholder="Digite um Código"></div>

<div class="search-box__full search-box--now-2">
<input type="submit" name="verificar" id="btnenviar" class="icon-search search-property__button"  value="Buscar"/>
</div></div>

</fieldset></form>
</div>
</div>


<br /><br /><br /><br /><br /><br /><br />

<link rel="stylesheet" href="http://code.jquery.com/ui/1.10.1/themes/base/jquery-ui.css">

<script src="http://code.jquery.com/ui/1.10.1/jquery-ui.js"></script>



<script type="text/javascript">

function valor(pag) {


alert(+pag);

 
 
$("#bairro_" ).click(function() {
var $lnk = document.getElementById("lnk-city");
$lnk.src = $lnk.src.replace(/id=(.*)/, 'id=') +cidade_.value;
 



    
$( "#dialog" ).dialog( "open" );
});
$("#dialog").dialog({
    autoOpen: false,
    position: 'top' ,
    title: 'EDIT',
    draggable: false,
    width : 800,
    height : 500,

    resizable : true,
    modal : true,
    
    open: function(){
            jQuery('.ui-widget-overlay').bind('click',function(){
                jQuery('#dialog').dialog('close');
            })
        }
});
$(".ui-dialog-titlebar").hide();


}




</script>

Notem que no final do arquivo php logo abaixo montei um iframe para abrir uma janela modal na pagina acima e trazer os resultados recuperados pelo Id do select CIDADE, agora abaixo segue o arquivo php que busca e imprime os resultados através do id da cidade que irá trazer os bairros de cada cidade:

<?php
//CONECTA AO MYSQL                     
require_once("config.php");           

//RECEBE PARÃMETRO                     
$idcidade = $_GET["id"];
//QUERY  
$sql = $MySQLi->query("SELECT bairro FROM  bairros AS inicial WHERE idcidade='".$idcidade."' ORDER BY id")or die (mysqli_error());

//EXECUTA A QUERY  
$row= mysqli_num_rows ($sql);
while($linha=mysqli_fetch_array($sql)){
$bairro=$linha['bairro'];	
echo "<input type='checkbox' value='".$bairro."' name='bairro_' id='bairro_'/>".$bairro."<br />";

//FECHA IF (row)                                               
//PRINTA O RESULTADO  

}

?>
<div id="dialog" style="display:none;" title="Dialog Title"><iframe frameborder="0" scrolling= "no" width="100%" height="100%" src="combo_cidades.php?id=" id="lnk-city"></iframe></div>

O que eu pretendo na verdade é que quando for escolhido o tipo de cidade , é feita uma requisição no arquivo php e seleciona os bairros apenas da cidade pretendida, e aí quando for clicado no select BAIRRO, abra uma janela modal ou lightbox e imprima esses resultados com cada bairro com suas checkbox para serem selecionadas pelo usuário, até aí eu consegui, mas não consigo jogar esses valores dentro o value, e sei que o iframe que montei não tem nada haver, mas só para tentar achar a lógica certa para chegar no resultado pretendido , e também vi que é possível fazer uma array dentro do select do tipo quando o usuário quizer a busca por mais bairros dentro do select, ele teria os resultados buscados de acordo com a seleção, que nem neste exemplo deste site http://www.erichynds.com/examples/jquery-ui-multiselect-widget/demos/ desde já fico grato.

[Jeovane Carvalho 6]

Vejam pessoal montei o site e aqui esta o link : http://www.netsistec.com.br/site_imob/empresa

 

Eu consigo abrir o modal e montar os checkbox com os bairros, mas não consigo fazer com o select BAIRRO se insira no value para eu pegar via POST no php, as outras seleções consigo resgatar normalmente ...