How to clean the inputs after performing an ajax request?

Question

How to clean the inputs after performing an ajax request?

Navigation

#1 by (1 votes)
#2 by (0 votes)

0

I have a function in AJAX that while loading information from the database to feed the inputs is written "Loading ...". If it does not find any information it continues with this loading in inputs until I refresh the page or do another search. I made if at the end to clear input but I can not, does anyone have any ideas?

Follow the code below:

//-----------------------------------------------------
//Funcao: functionjson
//Autor: Rafael Assmann <[email protected]>
//Sinopse: Json para capturar código do produto e reali
//zar a busca no banco de dados e preencher os demais campos deste produto
//Parametro:
//   codProduto[] : código do produto digitado para pesquisa
//Retorno: nomeProduto[], qtProduto[] e valorProduto[] : informações do BD
//-----------------------------------------------------
$(document).ready(function(){
  $(document).delegate(".codigoProduto", "blur", function() {
         var parent = $(this).parent();
         var nomeProduto = parent.children("input:eq(1)");
         var qtProduto = parent.children("input:eq(2)");
         var valorProduto = parent.children("input:eq(3)");

             $( nomeProduto ).val('Carregando...');
             $( qtProduto ).val('Carregando...');
             $( valorProduto ).val('Carregando...');

             $.getJSON(
                 'function.php',
                 { codProduto: $( this ).val() },
                 function( json ) 
                 {
                      $( nomeProduto ).val( json.nomeProduto );
                      $( qtProduto ).val("1");
                      $( valorProduto ).val( json.valorProduto);
                     }
             );
                      if(json.nomeProduto == null)
                      $( nomeProduto ).val( " " ); // caso não encontre o produto no banco não esta caindo nesta condição para zerar o campo.   
     });
});

The database query file function.php :

<?php
    /**
     * função que devolve em formato JSON os dados do cliente
     */
    function retorna( $nome, $db )
    {
        $sql = "SELECT 'identProduto', 'codProduto', 'qtProduto', 'nomeProduto', 'valorProduto' FROM 't_estoque' WHERE 'codProduto' = '{$nome}' ";

             $query = $db->query( $sql );

             $arr = Array();
             if( $query->num_rows )
             {
                 while( $dados = $query->fetch_object() )
                 {
                     $arr['nomeProduto'] = $dados->nomeProduto;
                     $arr['qtProduto'] = $dados->qtProduto;
                     $arr['valorProduto'] = $dados->valorProduto;
                 }
             }
             if($arr['qtProduto'] == 0){
                $arr['nomeProduto'] = 'sem estoque';
                $arr['qtProduto'] = '0';
             }
             return json_encode( $arr );
        }

    /* só se for enviado o parâmetro, que devolve os dados */
    if( isset($_GET['codProduto']) )
    {
        $db = new mysqli('localhost', 'root', '', 'buchm613_buchmann');
        echo retorna( filter ( $_GET['codProduto'] ), $db );
    }

    function filter( $var ){
        return $var;//a implementação desta, fica a cargo do leitor
    }
?>

jquery ajax json

asked by anonymous 07.11.2014 / 14:23

2 answers

min-height, does not work on mobile what do I do? [closed] file_exists to verify news

score 1 · Answer 1

Your problem is where you put the condition. You put it out of the request, and as JS will run asynchronously, its condition executes before the return of your server.

To run at the correct time, you need to add the condition inside the callback function. What would your call look like:

$.getJSON(
    'function.php',
    { codProduto: $( this ).val() },
    function( json ) 
    {
        $( nomeProduto ).val( json.nomeProduto );
        $( qtProduto ).val("1");
        $( valorProduto ).val( json.valorProduto);

        if(json.nomeProduto == null)
            $( nomeProduto ).val( "" );
    }
);

score 0 · Answer 2

0

Try this out

if(json.length < 1){
  $(nomeProduto).empty();
}

ou 

if(!json.nomeProduto){
  $(nomeProduto).empty();
}

07.11.2014 / 20:34