Cargar diferentes forms con ajax en html

M

marcoarreguin

Lanero Regular
29 May 2008
3
Tengo en html una lista de links, y necesito que al presionar uno de ellos se carguen las cajas de textos y botones que le corresponden, pero sin que se refresque toda la pagina, por eso lo de utilizar ajax.
Ejemplo:
Tengo un link a productos y otro a proveedores, necesito que al darle clic a productos aparezca un boton y dos cajas de texto (por ejemplo) y al darle en proveedores 3 botones y una caja de texto, todo esto sin refrescar toda la pagina.
Alguien que me pudiera proporcionar un ejemplo y yo lo desarrollo o algunas paginas o blogs que me ayuden, ya que no se como buscar esto que necesito en google, no he encontrado lo que necesito :s.
Agredezco enormemente su ayuda.
 
No se si te he entendido, pero kieres ke pase algo semejante a lo ke pasa con los lightbox, ke alguien da click en un link o imagen, y automaticamente se pone el fondo oscuro y aparece un cuadro con la imagen mas grande, o video, o web, etc. Luego de cerrarlo, se vuelve a ver el sitio de forma normal.

Eso te entendi, y de ser asi, lo ke podes usar es un lightbox con capacidad de iframes, asi al dar click en un link HTML, este te abre otra pagina HTML con iframes por medio del lightbox, y todo esto, sin refrestar la página.

no se si me entendiste... o si te entendí xP
 
Zore dijo:
No se si te he entendido, pero kieres ke pase algo semejante a lo ke pasa con los lightbox, ke alguien da click en un link o imagen, y automaticamente se pone el fondo oscuro y aparece un cuadro con la imagen mas grande, o video, o web, etc. Luego de cerrarlo, se vuelve a ver el sitio de forma normal.

Eso te entendi, y de ser asi, lo ke podes usar es un lightbox con capacidad de iframes, asi al dar click en un link HTML, este te abre otra pagina HTML con iframes por medio del lightbox, y todo esto, sin refrestar la página.

no se si me entendiste... o si te entendí xP
Haz clic para expandir...

No exactamente, no quiero que lo despliegue, si no que lo muestre en la misma pagina sin recargarla toda, por eso lo hare con ajax.
Por ejemplo que en este foro al darle nuevo tema, en vez de cargar toda la pagina cargara un cuadro de texto y un boton para escribirlo, pero no en una ventanita independiente si no en algun espacio en blanco en la misma pagina.
 
mira maneja divs, algo como <div id="contenidoFormularios"></div> luego al link 1 por ejemplo le pones.. <a onclick="cargarContenido('contenidoFormularios','formLink1.htm');">link 1</a>, en ese caso el archivo formLink1.htm contiene tu formulario para ese link.. el codigo de ajax es:

Código: 
    function crearXMLHttpRequest() {
      var xmlHttp=null;
      if (window.ActiveXObject) 
        xmlHttp = new ActiveXObject("Microsoft.XMLHTTP");
      else 
        if (window.XMLHttpRequest) 
          xmlHttp = new XMLHttpRequest();
      return xmlHttp;
    }

   function cargarContenido(capa,url){
        var ajax = crearXMLHttpRequest();
        var capaContenedora = document.getElementById(capa);
        ajax.open ('GET', url, true);
        ajax.onreadystatechange = function() {
            if (ajax.readyState==1) {
                capaContenedora.innerHTML='Cargando...';
            }else if (ajax.readyState==4){
                if(ajax.status==200){
                    capaContenedora.innerHTML = ajax.responseText;
                }else if(ajax.status==404){
                    capaContenedora.innerHTML = "La direccion no existe.";
                }else{
                    capaContenedora.innerHTML = "Error: ".ajax.status;
                }
            }
        }
        ajax.setRequestHeader('Content-Type','application/x-www-form-urlencoded');
        ajax.send(null);
        return;
    }
Lo que el hace es en tu Div, agregar al contenido del mismo los datos de tu archivo htm... Saludos
 

Los últimos mensajes

Los últimos temas

Arriba Pie
Atrás