Comunidad de diseño web y desarrollo en internet online

Enviar formulario con JQuery sin recargar pagina

Citar            
MensajeEscrito el 18 Oct 2012 08:39 pm
Buenas tardes, mi pregunta esta vez es sobre la forma para enviar datos de un formulario y mostrarlos en mi pagina. Aclaro que ya he buscado muchisimo y la verdad no me funciona, ya manejo sin problemas la parte de php y hago lo que necesito con css, ya me muestra datos pero en otra pagina php y lo que quiero es mostrarlos en un div con id. Les dejo el codigo como intento hacerlo, espero me puedan ayudar.

mi archivo js

Código :

var x;
x= $(document);
x.ready(ini);

function ini()
{
    $('form').submit(function(event) { 
    event.preventDefault(); 
    var url = $(this).attr('action'); 
    var datos = $(this).serialize(); 
    $.post(url, datos, function(resultado) { 
    $('#datos').html(resultado); 
  }); 
 }); 
}


Donde form es el name de mi formulario y #datos es mi div con el id correspondiente. en el action del formulario la pagina que esta es php/consulta_datos.php
Espero me puedan ayudar, de antemano muchas gracias por su tiempo y ayuda en este problemita.

Por jcsalazarm

38 de clabLevel



Genero:Masculino  

chrome
Citar            
MensajeEscrito el 18 Oct 2012 08:43 pm
Investiga sobre AJAX

Saludos!

Por SinSemilla

Claber

336 de clabLevel



Genero:Masculino  

i am that i am...

firefox
Citar            
MensajeEscrito el 18 Oct 2012 11:54 pm
Y si me das un empujon con el codigo que te muestro??
En verdad ya he consultado mucho sobre esto en JQuery, claro que no he buscado nada en ajax puro

Por jcsalazarm

38 de clabLevel



Genero:Masculino  

chrome
Citar            
MensajeEscrito el 19 Oct 2012 04:21 pm
Hola. Echa un vistazo aqui
http://www.malsup.com/jquery/form/#ajaxSubmit

es lo que necesitas, salu2!

Por comicSans

Claber

151 de clabLevel



 

firefox
Citar            
MensajeEscrito el 21 Oct 2012 07:31 pm
Mira, aquí tienes una solución mas que bien explicada A Fancy Ajax Contact Form

Lo que básicamente necesitas es leer un poco más sobre ajax.

Por Ferroandres

21 de clabLevel



Genero:Masculino  

Front-end + Back-end Developer

chrome
Citar            
MensajeEscrito el 22 Oct 2012 08:33 pm
Como es tu php? quiza el error sea parte de php

Por alez91

46 de clabLevel



 

Desarrollador Web

chrome
Citar            
MensajeEscrito el 22 Oct 2012 10:00 pm
Muchas gracias por la ayuda que me prestaron, ya solucione el problema; solo me faltaba retornar un valor de la función de JQuery.
Ahora les pido me ayuden con otra duda y es saber si es posible enviar datos a una función de PHP y tomar lo que retorna, es decir tener una función de PHP que me retorne un string y otra que retorne falso o verdadero pero mandando datos desde JQuery

Por jcsalazarm

38 de clabLevel



Genero:Masculino  

chrome
Citar            
MensajeEscrito el 22 Oct 2012 11:28 pm
Es normal como lo venis haciendo solo que en el php harias algo tal como

funciton ....toda tu funcion

y despues

echo tufuncion($_GET["datos mandados por ajax"]);

en la funcion tendrias que poner un return y el string a retornar

Por alez91

46 de clabLevel



 

Desarrollador Web

chrome
Citar            
MensajeEscrito el 23 Oct 2012 03:45 pm
Hola, gracias por la respuesta pero no me queda claro; como hago en el JQuery para llamar solo una función de PHP y para recibir lo que esta retorne. Es decir quiero con un mismo archivo de JQuery llamar varias funciones de PHP y tomar lo que me retornan para trabajarlas luego. Gracias por su colaboración y tiempo dedicado.

Por jcsalazarm

38 de clabLevel



Genero:Masculino  

chrome
Citar            
MensajeEscrito el 23 Oct 2012 04:18 pm
Una petición Ajax no es más que una petición HTTP común y silvestre de toda la vida. Y tal como no puedes llamar a una función declarada en un archivo PHP desde la barra de dirección de navegador, con Ajax tampoco puedes. A menos que el archivo PHP esté preparado especialmente para hacerlo.

Y la forma de hacerlo es pasando parámetros GET (o POST) en la URL que luego se descifrarían con PHP.

Supongamos que lo que quieres es saber si el ID que el visitante ha ingresado existe en una base de datos.

Para hacerlo, armas la petición Ajax con una URL tal como:

Código :

funciones.php?fnc=checkid&id=10

El archivo funciones.php debería contener algo como esto:

Código PHP :

if ($_GET['fnc'] == 'checkid') {
  CheckID($_GET['id']);
}
exit;
function CheckID($id) {
   if (ExisteEnLaDb($id)) {
    echo  'si';
  } else {
   echo 'no';
 }
}

Como una petición Ajax es una petición común y silvestre, lo que regresa el servidor es texto. Entonces la función de retorno de la petición Ajax no tiene más que comprobar si lo que viene del servidor es la cadena 'si' o 'no'.

Eso es todo.

Por DriverOp

Claber

2510 de clabLevel



 

opera
Citar            
MensajeEscrito el 23 Oct 2012 04:51 pm
Tal como dijo DriverOp solo que le agregaria que lo que devuelve el servidor es solo texto pero con la funcion eval(acalodevueltoporajax) conviertes ese texto en javascript :D

Por alez91

46 de clabLevel



 

Desarrollador Web

chrome
Citar            
MensajeEscrito el 23 Oct 2012 07:13 pm
Perfecto, ya comprendo. Muchas gracias por la claridad que me brindaron en el tema.

Por jcsalazarm

38 de clabLevel



Genero:Masculino  

chrome

 

Cristalab BabyBlue v4 + V4 © 2011 Cristalab
Powered by ClabEngines v4, HTML5, love and ponies.