Tema: Ayuda formulario en div con ajax
Ver Mensaje Individual
  #2 (permalink)  
Antiguo 21/10/2010, 09:38
luisal2908
 
Fecha de Ingreso: octubre-2010
Ubicación: Bogota
Mensajes: 28
Antigüedad: 14 años, 1 mes
Puntos: 1
Respuesta: Ayuda formulario en div con ajax
No se si sea tarde para darle una respuesta, pero lo que necesita se puede resolver con AJAX y php.

Si lo desea puedo enviarle a su correo un archivo con un ejemplo (necesitará tener instalado un servidor local compatible con php, como el servidor apache).

Ejemplo:
Archivo html donde tenemos el formulario (index.html):


Código HTML: 
Ver original
  1. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
  2. <html xmlns="http://www.w3.org/1999/xhtml">
  3. <head>
  4. <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
  5. <title>Documento sin t&iacute;tulo</title>
  6. <script type="text/javascript" src="js/ajax.js"></script>
  7. <script type="text/javascript">
  8. function FAjax(capa,nombre,edad){
  9.         var capaContenedora = document.getElementById(capa);
  10.         ajax=nuevoAjax();
  11.         ajax.open("GET", "recibe.php?nom="+nombre+"&edad="+edad,true);
  12.         ajax.onreadystatechange=function() {
  13.             if (ajax.readyState<4) {
  14.                 capaContenedora.innerHTML="Enviando.......";
  15.             }
  16.             if (ajax.readyState==4) {
  17.                 document.getElementById(capa).innerHTML=ajax.responseText;  //buscar.value = ajax.responseText;
  18.                 
  19.                 
  20.             }
  21.             
  22.         }
  23.         ajax.send(null)
  24. }
  25. </script>
  26. <script src="Scripts/AC_RunActiveContent.js" type="text/javascript"></script>
  27. </head>
  28.  
  29. <body>
  30. <div id='formulario'>
  31. <form name="forma" action="#" method="get" onsubmit="FAjax('capaContenedora',document.getElementById('nombre').value,document.getElementById('edad').value); return false" />
  32. Nombre<input id="nombre" type="text" value="" /><br/><br/>
  33. Edad<input  id="edad" type="text" value="" /><br/>
  34. <input name='enviar' type='submit'  id='enviar' value='Enviar'  />
  35. </form>
  36. <div id="capaContenedora" style="padding:0 0 0 6px; color:#FF0000"></div>
  37. </div>
  38. </div>
  39. </body>
  40. </html>

En la capa llamada 'capaContenedora' aparece el mensaje que devuelve el servidor.

Archivo php que procesa los datos del formulario (recibe.php):

Código PHP: 
Ver original
  1. <?
  2. $nombre=$_GET['nom'];
  3. $edad=$_GET['edad'];
  4. echo "Los siguientes datos se enviaron: ".$nombre." ".$edad;
  5. ?>


Espero le sirva el ejemplo.