(Resolvido) Ajuda com sintaxe do Ajax

[Rafael Laurindo]

Galera, gostaria de um exemplo de como criar um registro no banco usando ajax, mysql e php. Obrigado.

Editado Janeiro 20, 2010 por Rafael Laurindo

[Jonathan Queiroz]

Seria o mesmo problema desse tópico ?

Não tinha sido resolvido ?

Seria pra inserir a tabulação sem ter que apertar o TAB, é isso ?

[Rafael Laurindo]

Vou mudar o título deste tópico.

Editado Dezembro 23, 2009 por Rafael Laurindo

[Jonathan Queiroz]

Se ainda estiver com alguma dúvida sobre o tópico anterior, posta aí cara !

O fórum é pra isso.

Quanto à sua dúvida sobre AJAX, veja se o tópico Lista de Cursos para a linguagem JavaScript lhe ajuda. Tem alguns links interessantes sobre AJAX.

Você já sabe incluir registros no banco com PHP ? Se sim, será fácil. O AJAX vai fazer a requisição a uma página e, nessa página, você insere os registros no banco.

[Rafael Laurindo]

Jonathan, será que é possível você me mostrar um exemplo eu até entendi os métodos, só não entendi como tudo é feito, por exemplo, no método open, eu posso chamar um arquivo php por exemplo, e aew depois que eu chamo, o que acontece, eu não entendi, não entendi o que exatamente o método responseText e responseXML faz, e pra que serve exatamente o método send, tá tudo muito vago ainda pra mim, não sei como por exemplo, usando um arquivo php.

Editado Dezembro 19, 2009 por Rafael Laurindo

[Jonathan Queiroz]

Mais especificamente, veja esse link: http://www.tableless.com.br/artigos/ajaxdemo/

É bastante simples, deve lhe dar uma noção básica. Se ainda assim não conseguir entender, poste aí.

[Rafael Laurindo]

this.ajaxOpen = function (method, url, async, user, passwd){//cria um objeto ajax com o método, url informados
        //cria o objeto ajax
        var xmlhttp = XMLHttpRequest()
        //padrões
        if (method == undefined)
            method = 'POST'
        if (async == undefined)
            async == true
        if ((method == undefined) || (url == undefined))
            alert('Url não informada!')
        if ((user != undefined) && (passwd != undefined))
            xmlhttp.open(method, url, async, user, passwd)
        else
            xmlhttp.open(method, url, async)
        if(xmlhttp.readyState == 4){
            if (xmlhttp.status == 403)
                document.write("<b>Not Found!</b><br/><hr>") //Diretório não encontrado
            else if (xmlhttp.status == 404)
                document.write("<b>Forbiden!</b><br/><hr>") //Problema de permissão
            else if (xmlhttp.status == 500)
                document.write("<b>Internal Error!</b><br/><hr>")
            else
                return xmlhttp
        }
    }

Jhonatan, esse método (observe que é Orientado a Objeto) que eu criei é para apenas fazer a requisição ao servidor e abrir o arquivo, no meu caso .php, se ocorrer tudo OK ele retorna o objeto criado. A pergunta é, isso daria certo? Lógico, eu implementarei outras funções, mas a dúvida mesmo é: uma vez usando o método "open" eu não precisarei usar novamente, logo, preciso retornar só o objeto criado, por que os testes com a url informada já foram feitos?

Editado Dezembro 21, 2009 por Rafael Laurindo

[Jonathan Queiroz]

Nesse código tudo o que você fez foi dar as informações necessárias para a requisição, ainda não a iniciou. Para iniciar, utilize o método send.

No caso de uma requisição assíncrona, é necessário também criar uma função para quando terminar a requisição. Recomendo que crie mais um parâmetro na função ajaxOpen para passar essa função.

Nesse caso seu código ficaria mais ou menos assim:

this.IniciaRequisicao=function([...], funcao){
//[...]
xmlhttp.open(method,url,async)
//Se é assíncrona, precisamos do onreadystatechange
if(async){
  xmlhttp.onreadystatechange=function(){
    if(xmlhttp.readyState==4){
      if(typeof(funcao)=="function"){
        funcao(xmlhttp.responseText)
      }
    }
  }
}
//Enviamos o "send"
xmlhttp.send()
//Se é síncrona, executamos a função aqui
if(typeof(funcao)=="function"){
  funcao(xmlhttp.responseText)
}
}

Obs.:

Recomendo que utilize o operar unário de negação ! ao invés da comparação com undefined. dessa maneira, além do valor undefined você estará tratando o "null".

Outra coisa: Para utilizar o método POST você terá que configurar mais algumas coisas na requisição. Nesse caso, leia mais nesse link: http://www.hospedia.com.br/artigos/1/Ajax.html

Certa vez programei uma classe para utilizar AJAX de forma simplificada (nada muito sofisticado). Se quiser eu posto aqui.

[Rafael Laurindo]

Gostaria sim, se puder comenta-la também eu agradeço. Mais uma coisa, não entendi muito bem seu código não, ele verifica se o tipo de resuisição será assíncrona, e depois não entendi essa linha

xmlhttp.onreadystatechange=function(){

depois ele verifica o, depois não entendi essas linhas

if(typeof(funcao)=="function"){
        funcao(xmlhttp.responseText)
      }

Akeleabrass.

Editado Dezembro 21, 2009 por Rafael Laurindo

[Jonathan Queiroz]

O onreadystatechange é uma função que será executada quando o estado da requisição for alterado (enviando requisição, recebendo, sucesso, etc.). Na linha abaixo verificamos que o estado é 4 (sucesso). Também poderia verificar se o status é 200 (se não me engano é esse quando não há erros).

Depois nós verificamos se a função é realmente uma função. Por exemplo, se a pessoa não quiser executar a função ela simplesmente não passa o parâmetro (note que nossa função é o último parâmetro). Nesse caso um simples operador ! resolveria o problema (impediria os valores null, undefined, 0[qb] e "").

Mas por motivos obscuros a pessoa poderia passar um número não-nulo como parâmetro e, nesse caso, ocorreria um erro. Por isso utilizei o typeof (devolve o tipo de uma variável).

Na linha seguinte, eu somente chamei a função e passei o parâmetro equivalente ao retorno da requisição. A utilização da classe pode ser assim:

SuaClasseAjax.FuncaoIniciarRequisicao(
parametro1,parametro2,...,penultimo_parametro,
function(resultado){
  alert("O resultado da requisição é: \n"+resultado)
})

Coloquei várias linhas para facilitar a compreensão.

Quanto ao método POST, leia a parte 4 do link que passei. O Eduardo também postou no Repositório de Scripts o tópico Interface Ajax 2.0, que funciona tanto com o método GET quanto com POST. Tente analisar o código.

Em relação à minha classe, daqui a pouco posto no Repositório de Scripts. Tenho que arrumar algumas coisas antes.

[Rafael Laurindo]

Ta certo, mas esse "funcao" representa o que?

[Jonathan Queiroz]

Uma função que será executada quando a requisição terminar.

[Rafael Laurindo]

Quanto ao operador unário not, o que faço? Coloco ele ou o typeof() ao verificar se um parâmetro foi passado para a função?

[Jonathan Queiroz]

Faça como está no código, usando o typeof.

Edit: (25/12/2009)

Desculpe a demora pra postar o código, precisei fazer algumas correções (principalmente em relação à codificação). Mas devo postar hoje mais tarde.

[Jonathan Queiroz]

Postei a classe no Repositório de Scripts. Se quiser olhar: http://scriptbrasil.com.br/forum/index.php?showtopic=145629

[Rafael Laurindo]

o response text receberia o "ecoamento" do PHP, agora eu entendi. Obrigado Jonathan. Ta resolvido.

Editado Janeiro 20, 2010 por Rafael Laurindo