1. java
  2. android
  3. c#
  4. .net
  5. javascript
  6. php
  7. jquery
  8. html
  9. sql

JSON com Javascript, AJAX e PHP

Montei um formulário simples em HTML. Ao preencher a matrícula do funcionário neste form e deixar o campo (onblur), ele faz uma consulta no MySQL e deve retornar o nome e setor do funcionário. Ele não está me retornando nada e ao que parece o problema está na atribuição do retorno JSON à variável. O final do meu ajax.js é o seguinte:

ajax.js

var Ajax = function() {
    'use strict';

    var request;

    if (window.XMLHttpRequest) { // code for IE7+, Firefox, Chrome, Opera, Safari
        request = new XMLHttpRequest();
    } else { // code for IE6, IE5
        request = new ActiveXObject("Microsoft.XMLHTTP");
    }

    var url;
    var data;
    var method;

    var getUrl = function() {
        return url;
    }
    var setUrl = function(v) {
        url = v;
    }

    var getData = function() {
        return data;
    }
    var setData = function(v) {
        data = v;
    }

    var getMethod = function() {
        return method;
    }
    var setMethod = function(v) {
        method = v;
    }

    var send = function(loading, done) {
        if (!url) throw new Error('Url esperada.');
        if (!method) {
            console.warn('Metodo não especificado. Presumido POST.');
            method = 'POST';
        }

        request.onprogress = function(event) {
            if (event.lengthComputable && loading) {
                var percentComplete = event.loaded / event.total * 100;
                loading(percentComplete);
            }
        };

        request.onreadystatechange = function() {
            if (request.readyState == 4 && request.status == 200 && request.responseText && done) {
                done(request.responseText.toString().replace('while(1);', ''));
            }
        };

        request.open(method, url, true);
        request.setRequestHeader('Content-Type', 'application/x-www-form-urlencoded; charset=utf8');
        request.send(data);
    }


    return {
        getUrl: getUrl,
        setUrl: setUrl,
        getData: getData,
        setData: setData,
        getMethod: getMethod,
        setMethod: setMethod,
        send: send
    }
}

var campoMatricula = document.getElementById('matr_retirada');

campoMatricula.onblur = function() {
    var requestMatricula = new Ajax();


    requestMatricula.setUrl('getFuncionario.php');
    requestMatricula.setData('matricula = ' + this.value);
    requestMatricula.setMethod('POST');


    requestMatricula.send(null,

    function(resposta) {

        if (!resposta) {
            alert('Matrícula não encontrada');
            campoMatricula.focus();
            campoMatricula.clear();
            return false;
        }

       var dados = JSON.parse(resposta);

        document.getElementById("nome_retirada").value = dados[0].nome;
        document.getElementById("setor_retirada").value = dados[0].setor;
    });
}

RESULTADOS:

resposta:"[{"Tipo_Func":"F","matr_func":"123456","prefixo":"1234","nome_func":"Maria da Silva","setor":"financeiro"}] " dados:Array

Os resultados agora aparecem apenas quando dou um F5 na página..

  • Tem mesmo esse 123456 no início do JSON?

    lucastody   24 de set de 2014
  • Sim Lucas, ele aparece concatenado o número da matrícula que eu mandar buscar o resultado do JSON. Não sei se interfere em algo, mas editei a pergunta e coloquei o código final do meu PHP que busca os dados do MySQL.

    garsaldo   24 de set de 2014
  1. Você vai ver essas setas em qualquer página de pergunta. Com elas, você pode dizer se uma pergunta ou uma resposta foram relevantes ou não.
  2. Edite sua pergunta ou resposta caso queira alterar ou adicionar detalhes.
  3. Caso haja alguma dúvida sobre a pergunta, adicione um comentário. O espaço de respostas deve ser utilizado apenas para responder a pergunta.
  4. Se o autor da pergunta marcar uma resposta como solucionada, esta marca aparecerá.
  5. Clique aqui para mais detalhes sobre o funcionamento do GUJ!

1 resposta

Não é a resposta que estava procurando? Procure outras perguntas com as tags json ajax javascript ou faça a sua própria pergunta.