Jump to content
  • Revista PROGRAMAR: Já está disponível a edição #60 da revista programar. Faz já o download aqui!

Sign in to follow this  
F_Correia

Consultas sem refresh

Recommended Posts

F_Correia

Eu gostava que alguem me explica-se como fazer consultas sem fazer um refresh , vou vos mostrar um print com o que quero, ver se alguem me consegue ensinar a fazer.

166lq85.jpg

As consultas são feitas em PHP, ou seja, carrego a combobox, depois no onchange (Quando escolhem um servidor) vai me fazer 2 consultas em php para me encontrar o fornecedor do servidor ou seja o dono e devolver-me ao lado onde diz Fornecedor.

Já me deram 1 exemplo, mas esse exemplo não envolvia nada de php nem de consultas. dai eu tar a nora, php ainda percebo alguma coisa, agora javascript/jquery é praticamente 0.


Porque havia eu se assinar ? A minha mãe diz que é perigoso ter as nossas assinaturas na net ! :S

Share this post


Link to post
Share on other sites
Knitter

Falaste em jQuery, será uma boa opção para o que pretendes fazer.

Este tipo de interacção é comum ser feito com AJAX, se usares uma biblioteca que facilite o desenvolvimento de aplicações AJAX, como o jQuery, tens metade do trabalho feito. O que precisas fazer é a parte do lado do servidor.

Tentando dar um exemplo de como podias fazer a pesquisa que tens na imagem:

function pesquisa(check, combo) {
var tipo = //... encontrar o tipo de produto...    
$.ajax({
        type: "GET",
        url: <url para ficheiro PHP que irá tratar o pedido>, 
       data: ({tipoProduto : tipo, servidor: combo.value}),
        dataType: "json",
        success: function(obj) {
            //preencher o campo correcto com o valor devolvido
            }
        }
    });
}

Do lado do PHP terias de tratar o pedido feito fazendo a pesquisa e devolvendo, no caso do exemplo, dados no formato JSON.

Se vires a documentação do jQuery tens imensos exemplos fáceis de seguir sobre como fazer pedidos AJAX, e se os pedidos forem simples, podes ser coisa para uma linha de código. Eu compliquei um pouco no exemplo porque tirei parte de um pedido em que estava a trabalhar e modifiquei e no meu caso era mais complexo.

Share this post


Link to post
Share on other sites
F_Correia

data: ({tipoProduto :  tipo, servidor: combo.value}),

aqui são os valores que quero enviar para lá ? ou são os valores que quero receber ?

  //preencher o campo correcto com o valor devolvido

qual é o codigo para preencher uma caixa de texto com o valor ? que nos vai devolver ? Alias eu nem vou a ver qual é o código que vai devolver o valor que quero


Porque havia eu se assinar ? A minha mãe diz que é perigoso ter as nossas assinaturas na net ! :S

Share this post


Link to post
Share on other sites
Knitter

No campo "data" vão os valores que queres enviar para o script. Neste caso como indiquei que ia usar GET, o jQuery vai transformar isso em qualquer coisa do estilo <url>?tipo=<tipoProduto>&servidor=<servidor>. No script tens acesso a estes dados através da variável $_GET, como em qualquer outro pedido GET.

Os dados devolvidos são os que tu colocares no script. Por exemplo, no meu caso o script desse pedido, no fim de processar vários dados faz apenas:

    //....
    if(...) {
        echo "{'existe': 1}";
        return;
    }

    echo "{'existe': 0}";
}

Dentro do bloco "sucess" eu tenho acesso a um objecto JSON que tem a variável "existe" e com essa faço outros tratamento, essa é a resposta que chega o jQuery em caso de sucesso, que no exemplo acima é sempre.

Para preencheres um campo depende do que tens. Podes usar jQuery e aceder através do id do elemento ou através dos método base do javascript, por exemplo

//Com jQuery, pode ser diferente dependendo do objectivo e sintaxe usada
$('#<id>')[0].value = <novo valor>
//sem jQuery
document.getElementById(<id do elemento).value = <novo valor>

Nota que sempre que uso os caracteres < e > é porque é algo que tens de substituir por um valor que faça sentido no teu caso.

Share this post


Link to post
Share on other sites
F_Correia

<script type="text/javascript" language="javascript">
function  pesquisa(idservidor) {
var id = $("#idservidor").val();   
$.ajax({
        type: "GET",
        url: jsfornecedor.php,
       data: ({idservidor : id, nomefornecedor: nome),
        dataType: "json",
        success: function(obj) {
         $('#message')[0].value = nomefornecedor
            }
        }
    });
}
</script>

Vai ser algo como isto ?


Porque havia eu se assinar ? A minha mãe diz que é perigoso ter as nossas assinaturas na net ! :S

Share this post


Link to post
Share on other sites
Knitter

Duas coisas que acho que estão mal Não está a usar o valor devolvido pelo script. Os valores devolvidos pelo script, se usares JSON, vêm na variável obj que é passada para dentro da função executada em caso de sucesso.

É essa variável que tens de usar, ou as variáveis que forem passadas aí, e tem de ser de acordo com o que devolves do lado do PHP. Portanto passarias $('#message')[0].value = nomefornecedor a algo como $('#message')[0].value = obj.nomefornecedor.

E como estamos à procura do nome do fornecedor não podes passar isso para o script, afinal é isso que queres que seja procurado pelo PHP e que seja devolvido, portanto nos dados passados não vejo porque é que estás a passar o nomefornecedor.

Olhando para a imagem, o nome do fornecedor é determinado de acordo com o tipo de produto e com o servidor, por isso o que tens de passar para o PHP são esses dois valores, que depois são usados para fazer a pesquisa.

Share this post


Link to post
Share on other sites
F_Correia

Tens aqui um resumo dos 2 files

jsfornecedor.php

<?
$id=$_GET['idservidor'];
$resultado=mysql_query("Select * from servidores where idservidor='$id'");
$linhas=mysql_fetch_row($resultado);
$pesquisa=$linhas[7];
$resultadox=mysql_query("Select * from fornecedores where idfornecedor='$pesquisa'");
$linha=mysql_fetch_row($resultadox);
$nome=$linhas[3];
?>

registo.php

<script type="text/javascript" language="javascript">
function  pesquisa(idservidor) {
var id = $("#idservidor").val();   
$.ajax({
        type: "GET",
url: jsfornecedor.php,
       data: ({idservidor : id, nomefornecedor: nome),
        dataType: "json",
        success: function(obj) {
         $('#message')[0].value = nomefornecedor
            }
        }
    });
}
</script>

Furmulario da mesma página

<select name="idservidor" id="idservidor" onChange="pesquisa()"></select>
<label>Fornecedor:</label><input type="text" id="message" />


Porque havia eu se assinar ? A minha mãe diz que é perigoso ter as nossas assinaturas na net ! :S

Share this post


Link to post
Share on other sites
Knitter

function  pesquisa(idservidor) {
    var id = $("#idservidor").val();  
    $.ajax({
        type: "GET",
        url: jsfornecedor.php,
        data: ({idservidor : id}),
        dataType: "json",
        success: function(obj) {
            $('#message')[0].value = obj.nome
        }
    });
}

No fim do PHP tens de devolver o valor que encontraste.

echo "{'nome': '$nome'}";

Acho que não me enganei em nada. Mas é uma questão de ires fazendo as coisas por passos, no PHP podes começar por simplesmente mostrar os dados do pedido, e no javascript ir vendo como é que a execução é feita, recomendo que tenhas o Firebug instalado no Firefox para veres algum erro de javascript que surja.

Share this post


Link to post
Share on other sites
F_Correia

já não está a dar erros, mas a uma coisa que me está a fazer confusão e dai ele não me estar apresentar os resultados

            $('#message')[0].value = obj.nome

Se o obj.nome vai ser o message ou seja o objecto que quero que fique com  o value do outro lado vai ser o nome ?

            $('#nome')[0].value = obj.nome

assim ?

PS: ele não entra na função .. não sei o porque

Abraços


Porque havia eu se assinar ? A minha mãe diz que é perigoso ter as nossas assinaturas na net ! :S

Share this post


Link to post
Share on other sites
F_Correia

esse é o 2º problema, mas o 1º é como fazer que ele entre dentro de        success: function(obj) {

para que entam agarre o valor do outro lado (o nome) e entam coloque na textfield que tá para receber o nome do fornecedor.


Porque havia eu se assinar ? A minha mãe diz que é perigoso ter as nossas assinaturas na net ! :S

Share this post


Link to post
Share on other sites
Knitter

Isso seria $("#message").val(obj.nome) em jquery.

São alternativas, uma ou outra fazem o mesmo.

No fim do pedido ter terminado a função definida para a acção de sucesso é sempre invocada. Desde que devolvas um valor do lado do PHP essa função é sempre executada. Coloca, por exemplo, um alert(obj) dentro da função de sucesso e vê o que é que ele está a mostrar ou se está a mostrar alguma coisa.

Share this post


Link to post
Share on other sites
F_Correia

    success: function(obj) {

          alert(obj);

        }

não acontece nada, simplesmente 0, nem a alert aparece  :thumbsup:

Abraços


Porque havia eu se assinar ? A minha mãe diz que é perigoso ter as nossas assinaturas na net ! :S

Share this post


Link to post
Share on other sites
F_Correia
<?

$id=$_GET['idservidor'];
$resultado=mysql_query("Select * from servidores where idservidor='$id'");
$linhas=mysql_fetch_row($resultado);
$pesquisa=$linhas[7];
$resultadox=mysql_query("Select * from fornecedores where idfornecedor='$pesquisa'");
$linha=mysql_fetch_row($resultadox);
$nome=$linhas[3];
echo "{'nome': '$nome'}";

?>


Porque havia eu se assinar ? A minha mãe diz que é perigoso ter as nossas assinaturas na net ! :S

Share this post


Link to post
Share on other sites
F_Correia

alguém me ajuda ? :S


Porque havia eu se assinar ? A minha mãe diz que é perigoso ter as nossas assinaturas na net ! :S

Share this post


Link to post
Share on other sites
Knitter

O que é aquele echo no fim?

Foi do exemplo que eu coloquei, e estava a trabalhar com uma versão do PHP sem funções JSON, mas sim, usar as funções é mais fácil e mais seguro.

Share this post


Link to post
Share on other sites

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now
Sign in to follow this  

×

Important Information

By using this site you accept our Terms of Use and Privacy Policy. We have placed cookies on your device to help make this website better. You can adjust your cookie settings, otherwise we'll assume you're okay to continue.