Jump to content

POWERED BY:

Archived

This topic is now archived and is closed to further replies.

Pita

Ajax e Formularios

Recommended Posts

Estou começando agora com Ajax e estou precisando de uma ajudinha para me animar a entender o codigo.

 

Fiz um formulario de teste usando a funçao do Pita.

 

<script src="ajax2.js" type="text/javascript"></script><div id="meio"><form id="form" name="form" method="post" action="c1.asp" onSubmit='return false;' ><input name="categoria" type="text" id="categoria" value="" size="50" /><input type="button"  value="Cadastrar" onClick="ajaxForm('document.getElementById("meio")','form')" /> <input name="disponivel" type="hidden" id="disponivel" value="1" /> </form></div>

 

Coloquei o onSubmit='return false;' para evitar que envie todo o formulario quando aperte o enter.

 

 

Aqui tenho a pagina c1.asp

<!--#include file="conexaoSQL.asp"--><%		disp=request.form("disponivel")if disp = "" thendisp = falseend ifINTRO2 = "INSERT INTO categoria (categoria,disp) VALUES('" & request.form("categoria") & "'," & disp & ") "Conn.Execute(INTRO2)'response.write "Oleeeeeeeeeeeeeeeeeeeeeeeeeeeee"'Response.Redirect "logado.asp?foi=1"%>

 

O que quero é fazer simples consultas de insert, update e delete.

 

Estou chamando a função errada?

 

Obrigado

Share this post


Link to post
Share on other sites

Não consigo fazer funcionar.

Coloquei a parte em ajax em um javacript externo e o inclui na header.

No meu HTML eu tenho isso:

 

<form name="form1" id="form1" action="processa.php" method="post"><p>Comentário? <input type="text" name="comentario" id="comentario"><input type="button" value="enviar" onClick="ajaxForm('resposta',form1)"></p></form><div id="resposta"><?php// FAZ UMA QUERY EXIBINDO OS COMENTÁRIOS EXISTENTES?></div>

E na página processa.php, eu tenho uma query que insere os valores postados pelo formulário no banco de dados mysql e outra que exibe (através do echo) a mesma query, só que agora atualizada com o novo comentário.

 

Mas, o formulário não está fazendo nada.

O que pode estar errado?

Share this post


Link to post
Share on other sites

Coloque com aspas normais tipo:function vai() { ajaxForm("div","formulario")}

Pra que essa nova função vai? Tentei assim no botão do form:onClick="ajaxForm("comentarioscontainer","dcomentarios")";não deu certo do mesmo jeito. :/

Share this post


Link to post
Share on other sites

Para chamar outra função. Não entendi ela também.O seu onclick está errado, não se usa aspas iguais no onclick e dentro da função que está no onclick.Tente com assimonclick='funcao("ba")'ouonclick="funcao('ba')"

Share this post


Link to post
Share on other sites

eu tentei usar o codigo com as funções e nao ta dando certo.

 

no ajaxLink :

 

<html><head><script language="javascript" type="text/javascript" src="ajax.js"></script></head><body><form action="cep.php" method="post" name="form" id="form">	<input type="text" name="cep" id="cep" onblur="ajaxLink('form_cep','cep.php?cep='+document.getElementById('cep').value);">	<input type="text" name="endereco" id="endereco" >	<input type="text" name="estado" id="estado" >	<input type="text" name="cidade" id="cidade" ><div id="form_cep"> </div></form> </body></html>
da o erro : erro em tempo de execução desconhecido linha 159 caracter 5

 

 

agora no ajaxForm

 

<html><head><script language="javascript" type="text/javascript" src="ajax.js"></script></head><body><form action="cep.php" method="post" name="form" id="form">	<input type="text" name="cep" id="cep" onblur="ajaxLink('form_cep','form')">	<input type="text" name="endereco" id="endereco" >	<input type="text" name="estado" id="estado" >	<input type="text" name="cidade" id="cidade" ><div id="form_cep"> </div></form> </body></html>

erro : da o erro : erro em tempo de execução desconhecido linha 159 caracter 5

Share this post


Link to post
Share on other sites

Obrigada Lex, agora está tudo certo. :}

Só um problema.

O da acentuação - enviando dados errados na hora de enviar para o BD.

Okay, depois de ler esta solução, eu fiz isto:

 

Na página .js onde está o código do Pitas, cole esta outra função:

 

// url_encode version 1.0 	function url_encode(str) { 		var hex_chars = "0123456789ABCDEF"; 		var noEncode = /^([a-zA-Z0-9\_\-\.])$/; 		var n, strCode, hex1, hex2, strEncode = ""; 		for(n = 0; n < str.length; n++) { 			if (noEncode.test(str.charAt(n))) { 				strEncode += str.charAt(n); 			} else { 				strCode = str.charCodeAt(n); 				hex1 = hex_chars.charAt(Math.floor(strCode / 16)); 				hex2 = hex_chars.charAt(strCode % 16); 				strEncode += "%" + (hex1 + hex2); 			} 		} 		return strEncode; 	}

 

Agora, no código do Pitas, modifique esta parte, com isto:

 

//Cria uma funcao interna para concatenar os elementos do form	this.ConcatenaElemento = function(nome,valor) {								if (queryString.length>0) {									queryString += "&";								}								queryString += url_encode(nome) + "=" + url_encode(valor);							 };

E é isso, os dados são salvos corretamente no banco. :}

Na hora de exibir, só é definir as headers

 

No caso do PHP:

header("Content-Type: text/html; charset=ISO-8859-1",true);

Share this post


Link to post
Share on other sites

Novo erro :/

Eu uso um método de urls açucaradas com o modRewrite do .htaccess.

Quando eu testo na página sem urls açucaradas (http://meusite.com/pagina.php?comentarios) tudo funciona corretamente.

Porém, quando eu uso na página com url amigável (http://meusite.com/pagina/comentarios) o div que recebe a resposta, recarrega a página (topo, conteudo, rodape) no interior do div alvo novamente e não posta o comentário. :(

 

Alguém tem alguma solução para isso?

Share this post


Link to post
Share on other sites

Estou com 1 problema. Não da para usar a função 2 vezes sem recarregar a página.Tipo se eu usar ela. Em uma página e tentar usar novamente ela aparece a msg de carregando e fica.toda vez que usa para poder usar novamente tem que recarregar. Se for assim não tem o porque utilizar.Eu devo estar fazendo algo errado.Função AJAXFORM

Share this post


Link to post
Share on other sites

Opa pessoal, eu estou de férias e estou entrando pouco na internet, vou responder algumas coisas:

 

F43!4NØ

dentro da funcao ajaxXMLHTTP_StateChange_Completo tem o seguinte código:

 

//Exibe o valor retornado no objeto de ID informadodocument.getElementById(id).innerHTML=retorno;

você pode alterar para algo +/- assim:

 

//Exibe o valor retornado no objeto de ID informadoif (retorno == "usuario inexistente"){	exibeMsg();	return false;}document.getElementById(id).innerHTML=retorno;

 

========================================================

 

 

ronanlumb

Em algum lugar você não tem uma funçao com o mesmo nome a está carregando ela, matando a original??

Share this post


Link to post
Share on other sites

tava dando erro na acentuação, eu trabalho com JSP , mas consegui arrumar kem kiser a dica olha ai

 

 

Antes

queryString += encodeURIComponent(nome) + "=" + encodeURIComponent(valor);
DEPOIS

//referencia: http://xkr.us/articles/javascript/encode-compare/	  //bug do acento arrumado	 queryString += encodeURIComponent(nome) + "=" + escape(valor);

Share this post


Link to post
Share on other sites

Já encontrei varias soluçoes para acento tanto em php como em jsp mais até agora nao consegui achar uma que funciona com o formulario + ASP.quem puder me ajuda.. obrigado desde de já

Share this post


Link to post
Share on other sites

Eu tentei dessa formaserver.HTMLEncode(request.form("campo))Mais nao resolveu meu problema, eu vou tentar a funçao que indicaram a cima. Eu nao tinha visto ela.eu posto aqui quando resolver meu problema.obrigado t+

Share this post


Link to post
Share on other sites

Obrigada Lex, agora está tudo certo. :}Só um problema.O da acentuação - enviando dados errados na hora de enviar para o BD.Okay, depois de ler esta solução, eu fiz isto:Na página .js onde está o código do Pitas, cole esta outra função:

// url_encode version 1.0 	function url_encode(str) { 		var hex_chars = "0123456789ABCDEF"; 		var noEncode = /^([a-zA-Z0-9\_\-\.])$/; 		var n, strCode, hex1, hex2, strEncode = ""; 		for(n = 0; n < str.length; n++) { 			if (noEncode.test(str.charAt(n))) { 				strEncode += str.charAt(n); 			} else { 				strCode = str.charCodeAt(n); 				hex1 = hex_chars.charAt(Math.floor(strCode / 16)); 				hex2 = hex_chars.charAt(strCode % 16); 				strEncode += "%" + (hex1 + hex2); 			} 		} 		return strEncode; 	}
Agora, no código do Pitas, modifique esta parte, com isto:
//Cria uma funcao interna para concatenar os elementos do form	this.ConcatenaElemento = function(nome,valor) {								if (queryString.length>0) {									queryString += "&";								}								queryString += url_encode(nome) + "=" + url_encode(valor);							 };
E é isso, os dados são salvos corretamente no banco. :}Na hora de exibir, só é definir as headersNo caso do PHP:
header("Content-Type: text/html; charset=ISO-8859-1",true);
deu certo. Já estava ficando preocupado.muito obrigado

Share this post


Link to post
Share on other sites

Estou com duvidas ao usar a função ajaxForm(); não está dando muito certo.

Vamos desde o principio.

 

pagina.htm

<html><head><script language="javascript" type="text/javascript" src="ajax.js"></script></head><body><a href="java script:ajaxLink('conteudo','teste.htm');">Teste</a><div id="conteudo"></div></body></html>

teste.htm

<html><head><meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" /><title>Untitled Document</title></head><body><table width="500" border="0" cellspacing="0" cellpadding="0">  <tr>	<td height="150"><form id="teste" name="teste" method="post" action="grava.php" onsubmit="ajaxForm(this,this)">	  <p>Nome:<br />		<input name="nome" type="text" id="nome" />		<br />	  Sobrenome:<br />	  <input name="sobrenome" type="text" id="sobrenome" />	  <br />	  <br />	  <input type="submit" name="Submit" value="Enviar" />	  </p>	  </form>	</td>  </tr></table></body></html>

Ao carregar a página teste.htm na div conteudo e enviar o form ele envia o form diretamente para o grava.php (página nova) e nao dentro da mesma div (conteudo), isso está certo?

Share this post


Link to post
Share on other sites

alguem poderia me ajudar com o ajaxform?!?! eu sei usar o ajaxpage, nao é esse script mas acho que fcuniona do mesmo modo, onde eu faço: ajaxpage('arquivo.php', 'nome_div'); , e esse ajaxform, como eu uso?!?! o arquivo que exibe o formulario é acessado assim: lista_info_cnr;php?com=editbd&id=NUM_ID[]´z

Share this post


Link to post
Share on other sites

Seguinte genteCabeçalho do FORM<form id="form_nome" name="formulario" method="POST" action="pagina_destino.php" onSubmit='return false;'>botão para enviar<input type="submit" name="enviar" id="enviar" value="Enviar" onClick='ajaxForm("form_nome","div_destino"); return false' class="frm" onMouseOver="this.className='frm-on';" onMouseOut="this.className='frm';"></form>Ilson

Share this post


Link to post
Share on other sites

×

Important Information

Ao usar o fórum, você concorda com nossos Terms of Use.