Pasar variable con ajax y php

Participa en el tema Pasar variable con ajax y php en el foro Desarrollo Web.
Estoy tratando de hacer pasar una variable por el método POST, y que me la ...

Buscar en este tema:

Búsqueda avanzada

1 2 >

desconectado
- 200
  
  MENSAJES
xarcos escribió hace 3 meses

¿Mensaje inapropiado?

#1 Pasar variable con ajax y php

Estoy tratando de hacer pasar una variable por el método POST, y que me la devuelva en un div o en un pop-up convertido a mayúsculas, pero no anda. Ya me leí varios tutoriales y lo mismo no me anda, estoy utilizando xampp, y también lo probé en 000webhost. Les adjunto el código a ver si le encuentran la falla. Saludos

io2.js
function obtenerObjetoHttp(){
if (window.ActiveXObject) {
return new ActiveXObject("Microsoft.XMLHTTP");
}

else
if (window.XMLHttpRequest) {
return new XMLHttpRequest();
}
else {
alert('Tú navegador no soporta Ajax');
return null;
}
}
function crea_query_string(){
var formdato = document.getElementById('entrada');
return "entrada=" + encodeURIComponent(formdato.value);
}

function setSalida(){
if (objetoHttp.readyState == 4){
if (objetoHttp.status == 200){
var respuesta = objetoHttp.responseText;
document.getElementById('salidadiv').innerHTML = respuesta;
alert(objetoHttp.responseText);
}

}
}
function doWork(){
var objetoHttp = new obtenerObjetoHttp();

objetoHttp.open("POST","mayusculas.php?",true);
objetoHttp.setRequestHeader("Content-Type", "application/x-www-form-urlencoded");
objetoHttp.setRequestHeader("Content-length", query_string.length);
objetoHttp.setRequestHeader("Connection", "close");
var query_string = crea_query_string();
objetoHttp.onreadystatechange = setSalida;

objetoHttp.send(query_string);
}

formulario.html
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<script language="JavaScript" type="text/javascript" src="io2.js"></script>
<title>Primer ejercicio aprendiendo ajax</title>
</head>
<body>
<form id="hola">
<label for="entrada">Dato de entrada</label>
<input type="text" name="entrada" id="entrada">
<input type="submit" onClick="doWork;" value="Enviar">
</form>


<div id="salidadiv">

</div>
</body>
</html>

mayusculas.php
<?php
var $mensaje = strtoupper($_POST('entrada'));
echo $mensaje;
}

?>

Responder a este tema

Citar

+

0

Me gusta

| Más
desconectado
- 300
  
  MENSAJES
Porklovsky escribió hace 3 meses ¿Mensaje inapropiado?

#2 Re: Pasar variable con ajax y php

Bueno, primero deberias cambiar el tipo del boton de Submit a button.

Por otra parte, es absolutamente necesario que sea por post? yo use AJAX con get y parece ser mas sencillo (no requiere request headers, o si esta mal, sigue andando)-

Por ultimo, en doWork, query_string lo estas usando antes de definirlo.

Salidos,

Comentar este mensaje

Citar

Me gusta este mensaje

desconectado
- 200
  
  MENSAJES
xarcos escribió hace 3 meses ¿Mensaje inapropiado?

#3 Re: Pasar variable con ajax y php

Lo que pasó es que no lo pude hacer con el método GET, así que probé con POST. Ahí lo modifiqué para GET con las indicaciones que me pusiste, pero lo mismo no me anda

formulario.html
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<script language="JavaScript" type="text/javascript" >
function obtenerObjetoHttp(){
if (window.ActiveXObject) {
return new ActiveXObject("Microsoft.XMLHTTP");
}

else if (window.XMLHttpRequest) {
return new XMLHttpRequest();
}
else {
alert('Tú navegador no soporta Ajax');
return null;
}
}
function crea_query_string(){
var formdato = document.getElementById('entrada');
return "entrada=" + encodeURIComponent(formdato.value);
}

function setSalida(){
if (objetoHttp.readyState == 4){
if (objetoHttp.status == 200){
var respuesta = objetoHttp.responseText;
document.getElementById('salidadiv').innerHTML = respuesta;
alert(objetoHttp.responseText);
}

}
}
function doWork(){
var objetoHttp = new obtenerObjetoHttp();
objetoHttp.open("GET", "mayusculas.php?"+query_string, true)

objetoHttp.onreadystatechange = setSalida;
objetoHttp.send(null);

}

</script>
<title>Primer ejercicio aprendiendo ajax</title>
</head>
<body>
<form>
<label for="entrada">Dato de entrada</label>
<input type="text" name="entrada" id="entrada">
<input type="button" onClick="doWork();" value="Convertir">
</form>


<div id="salidadiv">

</div>
</body>
</html>

mayusculas.php
<?php
var $mensaje= $_GET('entrada');
echo $mensaje;
?>

Comentar este mensaje

Citar

Me gusta este mensaje

desconectado

147

MENSAJES

jon4 escribió hace 3 meses ¿Mensaje inapropiado?

#4 Re: Pasar variable con ajax y php

Te paso un ejemplo usando usando Jquery.
ejemplo.html

Código HTML:

<html>
<head>
<!-- lo saco de los servers de Google -->
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.1/jquery.min.js"></script>    
</head>
<body>
<form method="post">
	Nombre <input type="text" name="nombre" id="nombre" />
    <input type="button" id="boton"  value="convertir a mayusculas"/>
</form>
<div id="respuesta">

</div>

<script type="text/javascript">
	//Asigno el evento "clic" al boton con id "boton"
		$("input#boton").click(function (event) {
			$.ajax({
				type: "POST",
				url: "ajax.php",
				data: "nombre="+$("input#nombre").val(),
				success: function(msg){
					//escribo el resultado en un div con id "resultado"
					 $("div#respuesta").html(msg);
					 /* //Poner en mayusculas desde JavaScript
					 $("div#respuesta").html(msg.toUpperCase());
					 */
				}
			});
		});
</script>

</body>
</html>

ajax.php

Código PHP:

  <?php

if (isset($_POST["nombre"])) {

    echo strtoupper($_POST["nombre"]);

}    

?>

Si lo necesitas sin Jquery, con otro framework de Javascript, o Javascript plano. Chifla.

Comentar este mensaje

Citar

Me gusta este mensaje

desconectado
- 300
  
  MENSAJES
Porklovsky escribió hace 3 meses ¿Mensaje inapropiado?

#5 Re: Pasar variable con ajax y php

Te esta faltando ponerle el nombre a la variable del querystring:

objetoHttp.open("GET", "mayusculas.php?entrada="+query_string, true);

Comentar este mensaje

Citar

Me gusta este mensaje
desconectado
- 200
  
  MENSAJES
xarcos escribió hace 3 meses ¿Mensaje inapropiado?

#6 Re: Pasar variable con ajax y php

Originalmente publicado por Porklovsky

Te esta faltando ponerle el nombre a la variable del querystring:

Está definicida en la función que llamo.
Estuve con un amigo que sabe más programación que yo hasta la madrugada y no lo pudimos hacer andar ni en su notebook, ni en la mía . Así que ahora voy a probar con jquery o prototype. Muchas gracias por su ayuda y tiempo

Comentar este mensaje

Citar

Me gusta este mensaje
desconectado
- 300
  
  MENSAJES
Porklovsky escribió hace 3 meses ¿Mensaje inapropiado?

#7 Re: Pasar variable con ajax y php

perdon, me confundi. El tema es que en la linea que te comente antes, query_string no esta definido. deberias poner:

objetoHttp.open("GET", "mayusculas.php?"+crea_query_string(), true);
Suerte,

Comentar este mensaje

Citar

Me gusta este mensaje
desconectado
- 26,149
  
  MENSAJES
Lukillas escribió hace 3 meses ¿Mensaje inapropiado?

#8 Re: Pasar variable con ajax y php

En tu ejemplo con POST, estás intentando utilizar la variable query_string antes de declararla, cuando establecés la cabecera Content-Length. Mové ese var hasta debajo de objetoHttp, y probá.

Otro problema que tenés es que cuando llamés a setSalida para procesar lo devuelto por objetoHttp, objetoHttp no va a tener visibilidad en esa función.

Probá de la siguiente forma:

objetoHttp.onreadystatechange = function () { // mete el codigo aca }

Saludos.

Editado por Lukillas - 20.08.2009 23:17 hs.

Comentar este mensaje

Citar

Me gusta este mensaje
desconectado
- 200
  
  MENSAJES
xarcos escribió hace 3 meses ¿Mensaje inapropiado?

#9 Re: Pasar variable con ajax y php

Originalmente publicado por Lukillas

En tu ejemplo con POST, estás intentando utilizar la variable query_string antes de declararla, cuando establecés la cabecera Content-Length. Mové ese var hasta debajo de objetoHttp, y probá.

Otro problema que tenés es que cuando llamés a setSalida para procesar lo devuelto por objetoHttp, objetoHttp no va a tener visibilidad en esa función.

Probá de la siguiente forma:

objetoHttp.onreadystatechange = function () { // mete el codigo aca }

Saludos.

Lukillas mirá te dejo el código con las modificaciones que vos mencionaste, que ya las probé antes con un amigo anteayer con los métodos, pero lo mismo no andan.

function obtenerObjetoHttp(){
if (window.ActiveXObject) {
return new ActiveXObject("Microsoft.XMLHTTP");
}

else if (window.XMLHttpRequest) {
return new XMLHttpRequest();
}
else {
alert('Tú navegador no soporta Ajax');
return null;
}
}

function doWork(){
var objetoHttp = new obtenerObjetoHttp();
var query_string = "entrada="+ encodeURIComponent(document.getElementById('entrad a').value);

objetoHttp.open("POST","mayusculas.php",true);
objetoHttp.setRequestHeader('Content-Type', 'application/x-www-form-urlencoded;charset=ISO-8859-1');

objetoHttp.setRequestHeader("Content-length", query_string.length);
objetoHttp.setRequestHeader("Connection", "close");

objetoHttp.onreadystatechange = function (){
if (objetoHttp.readyState == 4){
if (objetoHttp.status == 200){
var respuesta = objetoHttp.responseText;
document.getElementById('salidadiv').innerHTML = respuesta;
alert(objetoHttp.responseText);
}

}
}

objetoHttp.send(query_string);

}

mayusculas.php
<?php
$mensaje = strtoupper($_POST('entrada'));
echo $mensaje;

?>

Comentar este mensaje

Citar

Me gusta este mensaje
desconectado
- 26,149
  
  MENSAJES
Lukillas escribió hace 3 meses ¿Mensaje inapropiado?

#10 Re: Pasar variable con ajax y php

Hola, copié el código tal como me pasás en tu último post y funciona sin errores.

¿Qué problema tenés vos? ¿Cuál es el error que te tira?

Comentar este mensaje

Citar

Me gusta este mensaje

1 2 >

Estás en: Inicio >> Foros

« Tema anterior | Siguiente tema »

Relacionados
Populares
Usuarios Destacados

Estadísticas del tema

12 RESPUESTAS
2856 VISTAS
4 USUARIOS RESPONDIERON

Ir arriba

Pasar variable con ajax y php

Participa en el tema Pasar variable con ajax y php en el foro Desarrollo Web. Estoy tratando de hacer pasar una variable por el método POST, y que me la ...

Participa en el tema Pasar variable con ajax y php en el foro Desarrollo Web.
Estoy tratando de hacer pasar una variable por el método POST, y que me la ...