• Lunes 6 de Mayo de 2024, 09:57

Autor Tema:  Ajax  (Leído 2695 veces)

RadicalEd

  • Moderador
  • ******
  • Mensajes: 2430
  • Nacionalidad: co
    • Ver Perfil
Ajax
« en: Lunes 15 de Septiembre de 2008, 14:34 »
0
Hola chicos de SoloCodigo, estoy dandole poco a poco al AJAX y ahora me surge un problema que no he podido encontrar como solucionarlo; lo que pasa es que según tengo entendido (por lo poco que sé), por medio del "id" que se le asigne a una etiqueta esta recibira el valor que uno haya pasado a consultar en el server por medio del php asignado; mi problema es que si trato de asignarlo a un "INPUT TEXT" no me funciona, pero si lo hago con un "DIV" sí, como puedo para que el valor devuelto por el php me funcione, el código de todo es el siguiente:
Código: PHP
  1. //Para realizar la consulta (producto_liccom.php)
  2.     <select name='listpre' onChange="traerDatos(frmproducto.listpre.value, frmproducto.codigo_item.value)">
  3.       <option value='0' SELECTED>Escoja Lista</option>
  4.       <option value='L1'>Lista 1</option>
  5.       <option value='L2'>Lista 2</option>
  6.       <option value='L15'>Lista 15</option>
  7.       <option value='LP'>Lista Promociones</option>
  8.     </select>
  9.         
  10.         //Aclaro que los dos no pueden tener el mismo id al hacer la consulta por que sino no se imprimen los datos en ninguno de los 2
  11.     <div id="lstpre">Datos</div>
  12.  //En este se cargan los datos
  13.     <input style="text-align: right" size="6" type="text" name="lstpre" id="lstpre">
  14. //En este no se cargan por ser un input text
  15.  
  16.  
Código: Javascript
  1. //La función y el objeto ajax (ajax.js)
  2. //Tomado del Internet, no me acuerdo la página
  3. function nuevoAjax()
  4. {
  5.     /* Crea el objeto AJAX. Esta funcion es generica para cualquier utilidad de este tipo, por
  6.     lo que se puede copiar tal como esta aqui */
  7.     var xmlhttp=false;
  8.     try
  9.     {
  10.         // Creacion del objeto AJAX para navegadores no IE
  11.         xmlhttp=new ActiveXObject("Msxml2.XMLHTTP");
  12.     }
  13.     catch(e)
  14.     {
  15.         try
  16.         {
  17.             // Creacion del objet AJAX para IE
  18.             xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
  19.         }
  20.         catch(E) { xmlhttp=false; }
  21.     }
  22.  
  23.     if (!xmlhttp && typeof XMLHttpRequest!='undefined') { xmlhttp=new XMLHttpRequest(); }
  24.      return xmlhttp;
  25.  }
  26.  
  27. function traerDatos(listaEsc, itemEsc)
  28. {
  29.     // Obtengo la capa donde se muestran las respuestas del servidor
  30.     var capa=document.getElementById("lstpre");
  31.     // Creo el objeto AJAX
  32.     var ajax=nuevoAjax();
  33.     // Coloco el mensaje "Cargando..." en la capa
  34.     capa.innerHTML="Cargando...";
  35.     // Abro la conexión, envío cabeceras correspondientes al uso de POST y envío los datos con el método send del objeto AJAX
  36.     ajax.open("POST", "ajax.php", true);
  37.     ajax.setRequestHeader("Content-Type", "application/x-www-form-urlencoded");
  38.     ajax.send("codigo="+itemEsc+"&listapre="+listaEsc);
  39.  
  40.     ajax.onreadystatechange=function()
  41.     { 
  42.         if (ajax.readyState==4) 
  43.         { 
  44.           // Respuesta recibida. Coloco el texto plano en la capa correspondiente 
  45.           capa.innerHTML=ajax.responseText; 
  46.         } 
  47.     } 
  48. }
  49.  
  50.  
Código: PHP
  1. //El que genera la consulta (ajax.php)
  2. <?php 
  3.    include '../configuration.php';
  4.    $listapre = $_POST['listapre'];
  5.    $codigo = $_POST['codigo'];
  6.    
  7.    $query = "SELECT * FROM tblicitador_productos WHERE codigo LIKE '".$codigo."'";
  8.    $result = mysql_query($query) or die(mysql_error());
  9.  
  10.    if ($row=mysql_fetch_array($result))
  11.    {
  12.      switch($listapre) 
  13.      {
  14.        case 'L1':
  15.                  echo $elpre = $row[10];
  16.                  break;
  17.        case 'L2':
  18.                  echo $elpre = $row[9];
  19.                  break;
  20.        case 'L15':
  21.                  echo $elpre = $row[11];
  22.                  break;
  23.        case 'LP':
  24.                  echo $elpre = $row[2];
  25.                  break;
  26.      }
  27.    }
  28. ?>
  29.  

Alguna explicación para este problema
Gracias Chao
El pasado son solo recuerdos, el futuro son solo sueños

RadicalEd

  • Moderador
  • ******
  • Mensajes: 2430
  • Nacionalidad: co
    • Ver Perfil
Re: Ajax
« Respuesta #1 en: Lunes 15 de Septiembre de 2008, 14:48 »
0
Me respondo a mi mismo :P, probando probando con funciones JavaScript normales como cuando uno hace paso de datos a un control de un formulario, lo pudé hacer de esta manera:
Código: Javascript
  1.  if (ajax.readyState==4)
  2. {
  3.   // Respuesta recibida. Coloco el texto plano en la capa correspondiente
  4.   capa.innerHTML=ajax.responseText;
  5.   document.fromproducto.lstpre.value = ajax.responseText;
  6. }
  7.  
El pasado son solo recuerdos, el futuro son solo sueños

RadicalEd

  • Moderador
  • ******
  • Mensajes: 2430
  • Nacionalidad: co
    • Ver Perfil
Re: Ajax
« Respuesta #2 en: Lunes 15 de Septiembre de 2008, 14:56 »
0
Ahora tengo otro problema :wacko: si quito el <div id="lstpre">, no me toma los datos en el control input text; alguien sabe a que se debe???
El pasado son solo recuerdos, el futuro son solo sueños

shadow_rev

  • Miembro MUY activo
  • ***
  • Mensajes: 397
  • Nacionalidad: co
  • Un SPARTAN no muere en combate
    • Ver Perfil
    • http://shadowrev.blogspot.com
Re: Ajax
« Respuesta #3 en: Lunes 15 de Septiembre de 2008, 17:52 »
0
Edo, tienes 2 elementos con el mismo id (el div y el campo), cosa que no se puede hacer, ya que un id tiene que ser único. Supongo que te estará produciendo un error que dice "property innerHTML not found" o algo por el estilo, y aborta el programa sin escribirte el valor. Ponle otro id al input donde escribes el resultado, creo que con eso es suficiente.

:suerte:
Volará quien le ponga alas a sus sueños (Candidate for goddess)
Si el mal existe en este mundo, reside en el corazón de la humanidad (Edward D. Morrison - Tales of Phantasia)
Lo único que puedes cambiar del pasado, es lo que sientes por él en el presente (Lockon Stratos - Mobile Suit Gundam 00)
Ingeniero de Sistemas

RadicalEd

  • Moderador
  • ******
  • Mensajes: 2430
  • Nacionalidad: co
    • Ver Perfil
Re: Ajax
« Respuesta #4 en: Lunes 15 de Septiembre de 2008, 18:47 »
0
Cita de: "shadow_rev"
Edo, tienes 2 elementos con el mismo id (el div y el campo), cosa que no se puede hacer, ya que un id tiene que ser único. Supongo que te estará produciendo un error que dice "property innerHTML not found" o algo por el estilo, y aborta el programa sin escribirte el valor. Ponle otro id al input donde escribes el resultado, creo que con eso es suficiente.

:suerte:
Al parecer no leiste la parte que dice:
Código: PHP
  1. # //Aclaro que los dos no pueden tener el mismo id al hacer la consulta por que sino no se imprimen los datos en ninguno de los 2
  2.      <div id="lstpre">Datos</div>
  3.   //En este se cargan los datos
  4.      <input style="text-align: right" size="6" type="text" name="lstpre" id="lstpre">
  5.  //En este no se cargan por ser un input text
  6.  
Sin embargo esa parte ya quedo, lee el 3 post y veras cual ha sido mi último problema, aunque lo soluciones ocultando la etiqueta div.
El pasado son solo recuerdos, el futuro son solo sueños

shadow_rev

  • Miembro MUY activo
  • ***
  • Mensajes: 397
  • Nacionalidad: co
  • Un SPARTAN no muere en combate
    • Ver Perfil
    • http://shadowrev.blogspot.com
Re: Ajax
« Respuesta #5 en: Lunes 15 de Septiembre de 2008, 20:17 »
0
Cierto, no reparé en esos comentarios (y no me expliqué bien) :lol: , pero me refería precisamente a la línea 4 del 2do post:
Cita de: "Edo"
Código: Javascript
  1.  if (ajax.readyState==4)
  2. {
  3.   // Respuesta recibida. Coloco el texto plano en la capa correspondiente
  4.   capa.innerHTML=ajax.responseText;
  5.   document.fromproducto.lstpre.value = ajax.responseText;
  6. }
  7.  

Tu problema, según entiendo, está en que, después de borrar el div, el campo de texto no captura el resultado de la consulta en PHP; esto se debe a que (corrígeme si me equivoco), el script que hiciste captura el primer elemento con el id "lstpre" en la variable "capa", que corresponde al div y al campo de texto (asumo que todavía es <input style="text-align: right" size="6" type="text" name="lstpre" id="lstpre">), posteriormente modifica la propiedad innerHTML (del div), y cambia el valor del input accediendo a él a través del nombre de variable. Cuando eliminas el div, la variable "capa" va a ser entonces el objeto input, el cuál no tiene la propiedad innerHTML (por eso te dije que le cambiaras el id del input).

Si quitas el div, necesariamente tenés que quitar la línea que escribe en el div (capa.innerHTML=ajax.responseText), porque te salta el error que te mencioné, y no te ejecuta el resto del programa (o al menos eso es lo que deduzco).

:suerte:
Volará quien le ponga alas a sus sueños (Candidate for goddess)
Si el mal existe en este mundo, reside en el corazón de la humanidad (Edward D. Morrison - Tales of Phantasia)
Lo único que puedes cambiar del pasado, es lo que sientes por él en el presente (Lockon Stratos - Mobile Suit Gundam 00)
Ingeniero de Sistemas

RadicalEd

  • Moderador
  • ******
  • Mensajes: 2430
  • Nacionalidad: co
    • Ver Perfil
Re: Ajax
« Respuesta #6 en: Lunes 15 de Septiembre de 2008, 20:52 »
0
nop, no sirve de esa forma, ya lo había intentado, además el input no tiene como id el lstpre.
El pasado son solo recuerdos, el futuro son solo sueños

F_Tanori

  • Moderador
  • ******
  • Mensajes: 1919
  • Nacionalidad: mx
    • Ver Perfil
Re: Ajax
« Respuesta #7 en: Lunes 15 de Septiembre de 2008, 22:32 »
0
Cita de: "Edo"
Ahora tengo otro problema :wacko: si quito el <div id="lstpre">, no me toma los datos en el control input text; alguien sabe a que se debe???

Tambien modificaste esta linea en tu JS ?

Código: Text
  1.  
  2. var capa=document.getElementById("lstpre");
  3.  
  4.  

Al borrar el DIV y si le colocas el id al Input capa sera un (obj)  input
Código: Text
  1.  
  2.  if (ajax.readyState==4)
  3. {
  4.   // Respuesta recibida. Coloco el texto plano en la capa correspondiente
  5.   capa.value = ajax.responseText;
  6. }
  7.  

Espero te sirva
Saludos
" ExIsTo y A vEcEs PiEnSo "

NOTA:
===========================================================================================================================
Este foro es para ayudar, aprender, compartir... usenlo para eso,
NO SE RESUELVEN DUDAS POR MENSAJE PRIVADO Y MENOS POR CORREO
===========================================================================================================================

RadicalEd

  • Moderador
  • ******
  • Mensajes: 2430
  • Nacionalidad: co
    • Ver Perfil
Re: Ajax
« Respuesta #8 en: Lunes 15 de Septiembre de 2008, 22:41 »
0
Cita de: "F_Tanori"
Cita de: "Edo"
Ahora tengo otro problema :wacko: si quito el <div id="lstpre">, no me toma los datos en el control input text; alguien sabe a que se debe???

Tambien modificaste esta linea en tu JS ?

Código: Text
  1.  
  2. var capa=document.getElementById("lstpre");
  3.  
  4.  

Al borrar el DIV y si le colocas el id al Input capa sera un (obj)  input
Código: Text
  1.  
  2.  if (ajax.readyState==4)
  3. {
  4.   // Respuesta recibida. Coloco el texto plano en la capa correspondiente
  5.   capa.value = ajax.responseText;
  6. }
  7.  

Espero te sirva
Saludos
No funciono tampoco.
El pasado son solo recuerdos, el futuro son solo sueños

F_Tanori

  • Moderador
  • ******
  • Mensajes: 1919
  • Nacionalidad: mx
    • Ver Perfil
Re: Ajax
« Respuesta #9 en: Lunes 15 de Septiembre de 2008, 23:11 »
0
Verifica cual es el error , puedes hacerlo facilmente con la consola de errores de Firefox

Saludos
" ExIsTo y A vEcEs PiEnSo "

NOTA:
===========================================================================================================================
Este foro es para ayudar, aprender, compartir... usenlo para eso,
NO SE RESUELVEN DUDAS POR MENSAJE PRIVADO Y MENOS POR CORREO
===========================================================================================================================

RadicalEd

  • Moderador
  • ******
  • Mensajes: 2430
  • Nacionalidad: co
    • Ver Perfil
Re: Ajax
« Respuesta #10 en: Lunes 15 de Septiembre de 2008, 23:36 »
0
Cita de: "F_Tanori"
Verifica cual es el error , puedes hacerlo facilmente con la consola de errores de Firefox

Saludos
No me muestra ningún error, solo errores de propiedad desconocida en el style.css con elementos como el scroolbar-arrow-color,
scroolbar-face-color, etc, etc.
El pasado son solo recuerdos, el futuro son solo sueños

shadow_rev

  • Miembro MUY activo
  • ***
  • Mensajes: 397
  • Nacionalidad: co
  • Un SPARTAN no muere en combate
    • Ver Perfil
    • http://shadowrev.blogspot.com
Re: Ajax
« Respuesta #11 en: Martes 16 de Septiembre de 2008, 04:34 »
0
Se me ocurre algo.... por qué no miras con el firebug los request que la aplicación está realizando y los publicas (la pestaña red) ?? Tal vez eso te pueda orientar un poco.

Si no lo tenes instalado (lo dudo, esa herramienta es fundamental para cualquier desarrollo web  :good: ), busca (en Firefox <= 3.0) en Herramientas -> Agregados, y en la sección Obtener Agregados, buscas con el buscador incorporado el firebug; o lo descargas desde la página http://addons.mozilla.org.
Volará quien le ponga alas a sus sueños (Candidate for goddess)
Si el mal existe en este mundo, reside en el corazón de la humanidad (Edward D. Morrison - Tales of Phantasia)
Lo único que puedes cambiar del pasado, es lo que sientes por él en el presente (Lockon Stratos - Mobile Suit Gundam 00)
Ingeniero de Sistemas