XAJAX - Pegando valores do formulário

PHPJavaScript
Enviado por Marcello R Gon... em Dom, 19/02/2006 - 12:21.PHP | JavaScript
Nesse tutorial estarei ensinando como pegar valores de campos habilitados e desabilitados de um formulário pelo XAJAX.
Mais informações sobre XAJAX clique no link abaixo http://www.phpavancado.net/node/209

Vamos lá mãos a obra e boa sorte.
  1. <?php
  2. // Include do xajax
  3. require_once("../xajax.inc.php");
  4.  
  5. // Função que ira pegar os valores do form
  6. function testForm($formData)
  7. {
  8.     // Instacia o objeto xajaxResponse
  9.     $objResponse = new xajaxResponse();
  10.     // Alert com os valores do formulário
  11.     $objResponse->addAlert("formData: " . print_r($formData, true));
  12.     // Alert com o valor do campo texto
  13.     $objResponse->addAlert("Valor do campo texto: " . $formData[textInput]);
  14.     // Imprime no div valores do formulário
  15.     $objResponse->addAssign("submittedDiv", "innerHTML", nl2br(print_r($formData, true)));
  16.     // Retorna a resposta de XML gerada pelo objeto do xajaxResponse
  17.     return $objResponse->getXML();
  18. }
  19.  
  20. // Estancia o objeto XAJAX
  21. $xajax = new xajax();
  22. // Faz um debug ao xajax
  23. //$xajax->debugOn();
  24. // Registre os nomes das funções em PHP que você quer chamar através do xajax
  25. $xajax->registerFunction("testForm");
  26. // Manda o xajax executar os pedidos acima.
  27. $xajax->processRequests();
  28. ?>
Apos feito toda a função em php agora vamos ao xhtml
  1. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
  2.         "http://www.w3.org/TR/2000/REC-xhtml1-20000126/DTD/xhtml1-transitional.dtd">
  3. <html xmlns="http://www.w3.org/1999/xhtml">
  4. <!-- Quando vc incluir a funçao que gera os javascripts necessário não esquece que colocar o caminho
  5. certo do diretorio que esta a classe xajax.
  6. Ex: xajax->printJavascript("../")
  7. -->
  8. <?php $xajax->printJavascript("../") ?>
  9. </head>
  10. <h2>&nbsp;</h2>
  11. <form id="testForm1" onsubmit="return false;">
  12. <div style="margin: 3px;">
  13. <div>Campo text </div>
  14. <input type="text" id="textInput" name="textInput" value="Texto" />
  15. </div>
  16. <div style="margin: 3px;">
  17. <div>Campo text desabilitado </div>
  18. <input name="textInput2" type="text" disabled="disabled" id="textInput2" value="Texto desabilitado" />
  19. </div>
  20. <div style="margin: 3px;">
  21. <div>Campo password </div>
  22. <input type="password" id="textInput" name="passwordInput" value="123456" />
  23. </div>
  24.  
  25. <div style="margin: 3px;">
  26. <div>Campo textarea</div>
  27. <textarea id="textarea" name="textarea">Php Avançado
  28. </textarea>
  29. </div>
  30.  
  31. <div style="margin: 3px;">
  32. <input type="checkbox" id="checkboxInput1" name="checkboxInput[]" value="true 1" checked="checked" />
  33. Campo c<label for="checkboxInput1">heckbox  1</label>
  34. </div>
  35.   <input type="checkbox" id="checkboxInput2" name="checkboxInput[]2" value="true 2" checked="checked" />
  36.   <label for="checkboxInput2">Campo checkbox 2</label>
  37. </div>
  38. </div>
  39.  
  40. <div style="margin: 3px;">
  41. <div>Campo radio </div>
  42. <input type="radio" id="radioInput1" name="radioInput" value="1" checked="checked" />
  43. <label for="radioInput1">Um</label>
  44. </div>
  45. <input type="radio" id="radioInput2" name="radioInput" value="2" />
  46. <label for="radioInput2">Dois</label>
  47. </div>
  48. </div>
  49.  
  50. <div style="margin: 3px;">
  51. <div>Campo Select</div>
  52. <select id="select" name="select">
  53.   <option value="1">Um</option>
  54.   <option value="2">Dois</option>
  55.   <option value="3">Tr&ecirc;s</option>
  56.   <option value="4">Quatro</option>
  57. </select>
  58. </div>
  59.  
  60. <div style="margin: 3px;">
  61. <div>Campo Multiplo  Select</div>
  62. <select id="multipleSelect" name="multipleSelect[]" multiple="multiple" size=4>
  63.   <option value="1">Um</option>
  64.   <option value="2">Dois</option>
  65.   <option value="3">Tr&ecirc;s</option>
  66.   <option value="4">Quatro</option>
  67. </select>
  68. </div>
  69. <span style="margin: 3px;">
  70. <input type="submit" value="Submit somente campos habilitados" onclick="xajax_testForm(xajax.getFormValues('testForm1')); return false;" />
  71. <input type="submit" value="Submit de todos os campos" onclick="xajax_testForm(xajax.getFormValues('testForm1',true)); return false;" />
  72. </span>
  73. </form>
  74. </div>
  75. <!-- div que ira receber o valor dos campos do form. -->
  76. <div id="submittedDiv" style=" margin: 3px;"></div>
  77. </body>
  78. </html>

Código completo: http://www.phpavancado.net/files/valores do form.php.txt
Boa sorte e até o próximo tutorial
"Deus não escolhe os capacitados e sim capacita os escolhidos!"


Enviado por JunioR (não verificado(a)) em Ter, 21/02/2006 - 12:01.

Olá marcelo,

Primeiramente quer parabenizá-lo pelo excelente artigo, estou começando com o xajax. Uso o xmlhttprequest uns 2 anos.

Sempre escrevi meus códigos "ajax" na mão mesmo, mas com o tempo surgiu a necessidade de um framework, resolvi utilizar o xajax.

Bom, minha dúvida é o seguinte.

Para pegar valores do formulários (get ou post) é usada a função getFormValues() certo? Quanto a isso tranquilo.

E para pegar valores que vêm de um link get?
ex: xxx.php?var1=123&var2=456

Lembrando que estes valores são dinâmicos.

Obrigado,

JunioR

Enviado por Marcello R Gon... em Ter, 21/02/2006 - 21:26.

Amigo muito obrigado pelos elogios.

bom para vc pegar o valor do get ou seja da url você devera usar a mesma variavel $_GET

exemplo:
www.site.com?nomesite=phpavancado
$objResponse->addAlert($_GET[nomesite]);

Qualquer duvidas é só perguntar.

Enviado por JunioR (não verificado(a)) em Qua, 22/02/2006 - 09:51.

Obrigado pelos esclarecimentos marcello. Consegui resolver da seguinte maneira:

Minha dúvida recaia numa classe de paginação que eu escrevi.

<a href="javascript:void(0);" onclick="xajax_myfunction(1)">1</a>
<a href="javascript:void(0);" onclick="xajax_myfunction(2)">1</a>
<a href="javascript:void(0);" onclick="xajax_myfunction(3)">1</a>

o parametro da função xajax_myfunction é o offset da busca.

[s]

JunioR

ps: vou criar um exemplo e postar aqui.

Enviado por Virgilio (não verificado(a)) em Ter, 04/04/2006 - 12:51.

Kra, estou com a seguinte duvida.

O ajax é uma tecnologia, que visa deixar as transações, browser-servidor, transparentes ao usuário porém, não se resumindo apenas a isso. Correto?

Em teoria, um usuário que utilize um browser sm suporte a javascript deveria utilizar uma pagina com ajax, normalmente, porem não contaria com os recursos do ajax. Correto?

Agora, vem minha dúvida.

No script acima você não especifica o "action" do formulário e alem disso, você determina que onsubmit="return false;".

Com essas especificações, apenas um browser com suporte a javascript consegue utilizar esta pagina.

Como corrigir este bug? Ele realmente procede ou me equivoquei?

Abraço!

Virgilio

Enviado por Marcello R Gon... em Qua, 05/04/2006 - 17:48.
Amigo se o browser não tiver suporte a javascript você não poderá executar nada via ajax.
você poderá fazer como exemplo abaixo para dar as duas opções ao usuário.
  1. <form onSubmit="xajax_blabla(); return false;" action="blabla.php">
  2.   <button>submit!</button>
  3. </form>

1º - Se o usuário tiver suporte ao JS a ação será executada xajax_blabla() na ação onSubmit.
2º - Se o usuário não tiver suporte ao JS o onSubmit será ignorado, então a ação acontecera dentro do blabla.php.
espero ter respondido suas duvidas.
abraços t+
Enviado por Diana (não verificado(a)) em Qua, 07/06/2006 - 12:12.

Olá Marcelo,
há pouco tempo utilizo o ajax, na verdade sou uma aprendiz. eu gostaria de saber se vc pode me ajudar a solucionar um problema?
bem o problema é que eu tenho um campo de Login, e tenho que fazer uma verificação no Banco se este login já esta cadastrado,esta verificaçao tem que ser feita antes do submit do form, então gostaria de saber como posso fazer isto em ajax?

Enviado por Akira (não verificado(a)) em Ter, 09/01/2007 - 09:30.

"esta verificaçao tem que ser feita antes do submit do form" eu nao entendi bem isso, voce quer validar o usuario sem enviar os dados? ou voce quer fazer duas requisições diferentes? bom ve se isso ajuda..

function Login($formulario){
$Resposta = new xajaxResponse();
$usuario = $formulario['login'];
$senha = md5($formulario['senha']);
$mysqli = new mysqli("host", "login", "senha", "banco");
$query = $mysqli->query("SELECT * FROM tabela WHERE(usuario=$usuario) AND(senha = $senha)");
$num = $query->num_rows;
if($num ==1){
$mensagem = "login efetuado com sucesso";
}
else {
$mensagem = "usuario e/ou login invalidos";
}
$Resposta = addAssign("div_alvo","innerHTML",$mensagem);
$Resposta = getXML();
}

$xajax = new xajax();
$xajax->registerFunction("Login");
$xajax->processRequests();

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<head>
<?php $xajax->printJavascript(); ?>
</head>
<body>
<div id="div_alvo" style="border:2px"></div>
<form name="formulario" action="return false;" method="post" id="formulario">
<input name="usuario" id="usuario">
<input name="senha" type="password" id="senha">
<a onclick="xajax_Login(xajax.getFormValues('formulario', true));">Login</a>
</form>
</body>
</html>

Enviado por Akira (não verificado(a)) em Ter, 09/01/2007 - 09:38.

Ops mau ai eu nem testei e nem separei as tags..>.> mas voce sabe neh...basicamente temos uma funcao em php que faz o login do usuario, verifica se existe e executa o bloco de comando de if, para recuperar o valor do formulario para o xajax existe a funcao getFormValues() que pega o valor do formulario pelo id do form, que esse por sua vez retorna uma array(), e na funcao voce recupera os dados da array que deseja: $formulario['nomedocampo']; ouvi falar que o internet explorer e o firefox tem interpretacao diferente da funcao getFormValues(), ahh e desculpa ter repondido no lugar do marcelo, mas espero que ajude...

Enviado por guest (não verificado(a)) em Qua, 17/01/2007 - 14:07.

Prezado Marcelo,

Você já desenvolveu alguma aplicação que grave ou escreva dados vindos de editores WYSIWYG(Spaw, FCK Editor, etc) com AJAX?

Não consigo pegar os valores das textareas montadas por eles. Na verdade acho que isso acontece pois eles montam um iFrame que recebe o valor até o POST, aí passam para a variável correta. Mas como não temos POST propriamente dito usando AJAX, como pego estes valores? Alguma forma de passar para a função o conteúdo do iFrame?

Se ja tiver passado por algo parecido me mande um help.

Desde já fica o meu agradecimento.

Enviado por Daniel (não verificado(a)) em Qua, 22/07/2009 - 17:46.

Use a função GetHTML.
É possível usála com integração javascript.

Veja o tutorial:
http://docs.fckeditor.net/FCKeditor_2.x/Developers_Guide/JavaScript_API

Abraço.
Daniel

Enviado por guest (não verificado(a)) em Sex, 30/03/2007 - 13:22.

Boa tarde, parabéns pelo artigo
Tenho uma dúvida ridiculamente simples, mas que estou apanhando aqui de 10 a zero .. .
O retorno na função xajax que tem a resposta . .é um array com os campos já identificados e com os valores a frente . . .
Estava testando o exemplo acima e funcionou ok em minha aplicação, porém estou apanhando na hora de manipular o resultado
Por exemplo, tenho um campo text em que digitei um valor, e vários campos text sem ter digitado nada no mesmo form . . .dei o submit ele retornou o array da mesma forma que no exemplo, porém estou tentando exibir somente o resultado do form em que eu digitei o valor(um único campo text) numa div, e na div é exibido o resultado:
Array
(
[nomeuser] => rodrigo
[senhauser] =>
[emp] => ca
[nomecliinc] =>
[endcliinc] =>
[cepcliinc] =>
[cidcliinc] =>
[foncliinc] =>
[cnpjcliinc] =>
[iecliinc] =>
)
Como faço pra manipular a saída - qual o nome desse array ou tenho que usar ajax pra manipular os resultados tb, ou estou viajando geral . . :-) ?
Obrigado