Ir para conteúdo

POWERED BY:

Arquivado

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

stay

Combo Dinâmico e dependente, mas com preenchimento textbox

Recommended Posts

Bom dia. Este é meu primeiro post aqui no fórum, pois sou novo em PHP e no próprio fórum.

Estou tentando adaptar 2 scripts que foram publicados pelo Willian Bruno, mas não estou obtendo o resultado esperado.
Meu objetivo seria que ao selecionar uma placa do veículo no primeiro combobox, nos dois próximos textbox seriam exibidos o nome do proprietário do veículo e a filial da empresa que ele está cadastrado. Logo na sequência, através do ajax, preciso criar uma lista de possíveis filiais destino para a qual o funcionário poderia se deslocar.
A primeira parte está funcionando e lista o nome e filial nos textbox corretamente, entretanto, não consegue atualizar o combobox dependente.

Estou me baseando em 2 exemplos do Willian Bruno conforme links abaixo:

http://wbruno.com.br/2009/08/26/combobox-preenche-input-ajax/

http://wbruno.com.br/2009/10/06/combos-dependentes-ajax-jquery/

 

Isoladamente funcionaram, porém ao tentar uní-los estou errando em algum procedimento.

Segue abaixo meu código:

index.php

 

<html>
<head>
    <script type="text/javascript" src="js/jquery.js"></script>
    <script type="text/javascript">
    $(document).ready(function(){
        $("select[name='cbplaca']").change(function(){
            var nome = $("input[name='nome']");
            var filial = $("input[name='filial']");

            $( nome ).val('Carregando...');
            $( filial ).val('Carregando...');

                $.getJSON(
                    'function.php',
                    { funcionario_id: $( this ).val() },
                    function( json )
                    {
                        alert(json);
                        $( nome ).val( json.nome );
                        $( filial ).val( json.filial );
                        var option = new Array();
                        resetacombo('cbdest');
                        $.each(json, function(i, obj){
                        
                        
                        option[i] = document.createElement('option');//criando o option
                        $( option[i] ).attr( {value : obj.id} );//colocando o value no option
                        $( option[i] ).append( obj.descricao );//colocando o 'label'

                        $("select[name='cbdest']").append( option[i] );//jogando um à um os options no próximo combo
                });
            });
        });
    });    


    function resetaCombo( el )
    {
        $("select[name='"+el+"']").empty();//retira os elementos antigos
        var option = document.createElement('option');                    
        $( option ).attr( {value : '0'} );
        $( option ).append( 'Escolha' );
        $("select[name='"+el+"']").append( option );
    }

    </script>
</head>
<body>
    <form action="" method="post">
        <label>Nome: <select name="cbplaca">
            <option value="">--</option>
<?php
    include 'function.php';
    echo montaSelect();
?>
        </select></label>
        <label>NOME: <input type="text" name="nome"  disabled="disabled" value="" /></label>
        <label>filial: <input type="text" name="filial" disabled="disabled" value="" /></label>
         <label><select name="cbdest">
            <option value="0">Escolha</option>
        </select></label>
   
        
    </form>


    <div id="test"></div>
</body>
</html>

 

function.php

 

<?php
    

    /**
     * função que retorna o select
     */
    function montaSelect()
    {
        $con = mysql_connect('localhost', 'root', '');
    mysql_select_db('portal', $con);
        $sql = "SELECT funcionario_id, placa FROM veiculo ORDER BY placa ASC";
        $query  = mysql_query("SET NAMES utf8", $con);
        $query = mysql_query( $sql );

        if( mysql_num_rows( $query ) > 0 )
        {
            while( $dados = mysql_fetch_assoc( $query ) )
            {
                $opt .= '<option value="'.$dados['funcionario_id'].'">'.$dados['placa'].'</option>';
            }
        }
        else
            $opt = '<option value="0">Nenhum cliente cadastrado</option>';

        return $opt;
    }

    /**
     * função que devolve em formato JSON os dados do cliente
     */
    function retorna( $funcionario_id = null)
    {
        $con = mysql_connect('localhost', 'root', '');
        mysql_select_db('portal', $con);
        $id = (int)$funcionario_id;

        $sql = "SELECT funcionario.id, nome, dist_filial, filial.descricao, cod_dest, cod_ua, filial.id FROM funcionario INNER JOIN veiculo INNER JOIN filial INNER JOIN destino ON  funcionario.id = veiculo.funcionario_id and funcionario.filial_id = filial.id and funcionario.id = {$id}";
        $query  = mysql_query("SET NAMES utf8", $con);
        $query = mysql_query( $sql );
        
        $sql2 = "SELECT id, descricao FROM destino WHERE cod_dest >1 ORDER BY id ASC";
        $query2  = mysql_query("SET NAMES utf8", $con);
        $query2 = mysql_query( $sql2 );

        
        

        $arr = Array();
        if( mysql_num_rows( $query ) )
        {
            while( $dados = mysql_fetch_object( $query ) )
            {
                $arr['nome'] = $dados->nome;
                $arr['filial'] = $dados->descricao;
                    while( $dados2 = mysql_fetch_object( $query2 ) ) {
                        $arr['option']    = Array('id'=> ( $dados2->id ), 'id'=> utf8_encode($dados2->descricao));
//                        
                    }
            }
        }
        else
            $arr[] = 'endereco: não encontrado';

        return json_encode( $arr );
    }

/* só se for enviado o parâmetro, que devolve o combo */
if( isset($_GET['funcionario_id']) )
{
    echo retorna( $_GET['funcionario_id'] );
}

 

 

Desde já agradeço pela atenção,

 

 

att.

 

Compartilhar este post


Link para o post
Compartilhar em outros sites

Bom dia. Fiz algumas alterações nos códigos seguindo algumas dicas. Falta pouco para funcionar. Quando seleciono a placa do veículo ele preenche nos textbox o nome do funcionário e a filial que ele está cadastrado. Entretanto, devido algum problema no laço ele está exibindo 4 vezes o conteúdo da combobox dependente. Segue abaixo o código provisório. Se alguém tiver alguma sugestão para melhorá-lo, favor anexar.

obrigado.

index.php

 

<html>
<head>
    <script type="text/javascript" src="js/jquery.js"></script>
    <script type="text/javascript">
    $(document).ready(function(){
        $("select[name='cbplaca']").change(function(){
            var nome = $("input[name='nome']");
            var filial = $("input[name='filial']");

            $( nome ).val('Carregando...');
            $( filial ).val('Carregando...');

                $.getJSON(
                    'function.php',
                    { funcionario_id: $( this ).val() },
                    function( json )
                    {
                        //alert(json);
                        $( nome ).val( json.nome );
                        $( filial ).val( json.filial );
                        var option = new Array();
                        //resetacombo(cbdest);
                        $.each(json, function(i, obj){
                        alert(json.id.length);
                        for(i = 0; i < json.id.length; i++){
                        option[i] = document.createElement('option');//criando o option
                        $( option[i] ).attr( {value : json.id} );//colocando o value no option
                        $( option[i] ).append( json.dest );//colocando o 'label'
                        $("select[name='cbdest']").append( option[i] );//jogando um à um os options no próximo combo
                        }
                });
            });
        });
    });    


    function resetaCombo( el )
    {
        $("select[name='"+el+"']").empty();//retira os elementos antigos
        var option = document.createElement('option');                    
        $( option ).attr( {value : '0'} );
        $( option ).append( 'Escolha' );
        $("select[name='"+el+"']").append( option );
    }

    </script>
</head>
<body>
    <form action="" method="post">
        <label>Nome: <select name="cbplaca">
            <option value="">--</option>
<?php
    include 'function.php';
    echo montaSelect();
?>
        </select></label>
        <label>NOME: <input type="text" name="nome"  disabled="disabled" value="" /></label>
        <label>filial: <input type="text" name="filial" disabled="disabled" value="" /></label>
         <label><select name="cbdest">
            <option value="0">Escolha um destino</option>
        </select></label>
   
        
    </form>


    <div id="test"></div>
</body>
</html>

 

function.php

 

<?php
    

    /**
     * função que retorna o select
     */
    function montaSelect()
    {
        $con = mysql_connect('localhost', 'root', '');
    mysql_select_db('portal', $con);
        $sql = "SELECT funcionario_id, placa FROM veiculo ORDER BY placa ASC";
        $query  = mysql_query("SET NAMES utf8", $con);
        $query = mysql_query( $sql );

        if( mysql_num_rows( $query ) > 0 )
        {
            while( $dados = mysql_fetch_assoc( $query ) )
            {
                $opt .= '<option value="'.$dados['funcionario_id'].'">'.$dados['placa'].'</option>';
            }
        }
        else
            $opt = '<option value="0">Nenhum cliente cadastrado</option>';

        return $opt;
    }

    /**
     * função que devolve em formato JSON os dados do cliente
     */
    function retorna( $funcionario_id = null)
    {
        $con = mysql_connect('localhost', 'root', '');
        mysql_select_db('portal', $con);
        $id = (int)$funcionario_id;

        $sql = "SELECT funcionario.id, nome, dist_filial, filial.descricao, cod_dest, cod_ua, filial.id FROM funcionario INNER JOIN veiculo INNER JOIN filial INNER JOIN destino ON  funcionario.id = veiculo.funcionario_id and funcionario.filial_id = filial.id and funcionario.id = {$id}";
        $query  = mysql_query("SET NAMES utf8", $con);
        $query = mysql_query( $sql );
        
        $sql2 = "SELECT id, descricao FROM destino WHERE cod_dest >1 ORDER BY id ASC";
        $query2  = mysql_query("SET NAMES utf8", $con);
        $query2 = mysql_query( $sql2 );

        
        

        $arr = Array();
        if( mysql_num_rows( $query ) )
        {
            while( $dados = mysql_fetch_object( $query ) )
            {
                $json['nome'] = $dados->nome;
                $json['filial'] = $dados->descricao;
                    
            }
            while( $dados2 = mysql_fetch_object( $query2 ) ) {
            
                    $json['id'][] = $dados2->id; //$ln['id'];
                    $json['dest'][] = $dados2->descricao;//$ln['descricao'];
                    

                    }
        }
        else
            $arr[] = 'endereco: não encontrado';

        return json_encode( $json );
    }

/* só se for enviado o parâmetro, que devolve o combo */
if( isset($_GET['funcionario_id']) )
{
    echo retorna( $_GET['funcionario_id'] );
}

Compartilhar este post


Link para o post
Compartilhar em outros sites

eita amigo..

 $.each(json, function(i, obj){
                        alert(json.id.length);
                        for(i = 0; i < json.id.length; i++){
vc fez um for dentro do each.

 

Ai vc encaixou os loop,s por isso está duplicando.

Ou vc tira o for, ou vc tira o each. Não usa os 2 juntos não.

Compartilhar este post


Link para o post
Compartilhar em outros sites

×

Informação importante

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