Comunidad de diseño web y desarrollo en internet online

Porque pierdo la variable de un SELECT generada con AJAX ?

Citar            
MensajeEscrito el 13 Ago 2008 08:02 pm
Hola:

Cierta parte de mi aplicacion trata de Agregar Productos a la BDD, para esto el formulario es cargado desde el mismo INDEX.PHP, de modo que parte importante del formulario es poder ubicar en una Seccion de alguna Categoria existente, he aqui donde entra la ayuda de AJAX.

Basicamente AJAX me ayudara a generar rapidamente (sin refrescar la hoja) un nuevo select en donde estaran las Secciones, para esto en el select de las Categorias colocare la funcion de ajax mediante onchange. Esto no me trae ningun problema, ya que una vez seleccionada la Categoria del select, inmediatamente se carga otro select con las Secciones correspondientes a dicha Categoria elejida.

El Problema surge al enviar el formulario (presionar el botn enviar), este boton realiza una accion del formulario enviando todo hacia la direccion index.php?id=productos&mov=agregar_producto, vaya esto ya es puro PHP, AJAX solo nos ayudo a generar el SELECT de Secciones, asi que, al momento de ir a agregar_producto, no logro recepcionar el contenido del select generado con ajax.

Basicamente aqui utilizo dos select que son: Categorias y Secciones, la variable donde porto el contenido de Categorias es categoria_productos y la variable donde porto las Secciones son: seccion_producto.

De modo que $_POST["seccion_producto"] no se genera o nose que sucede :S, pero no obtengo el valor de dicha variable.

Para una mejor ilustracion aqui dejo mi codigo resumido:

INDEX.PHP

Código :

<?php
switch( $_GET["mov"] )
   {
   case 'agregar_producto':
      echo "Categoria: ". $_POST["categoria_producto"];
      echo "<br>Seccion: ". $_POST["seccion_producto"];
      echo "<br>POST: ". count($_POST);
      echo "<br>";
      print_f($_POST); 
      break;
   default:
      echo "<form action=\"index.php?id=". $_GET["id"]. "&mov=agregar_producto\" method=\"POST\" enctype=\"multipart/form-data\">";
      echo "<div id=\"formulario_producto_nuevo\">";
      echo "Tipo de Prod.: <input type=\"radio\" name=\"tipo_producto\" value=\"1\" checked onclick=\"cargar_datos( 'id=". $_GET["id"]. "&mov=agregar_producto', 'formulario_producto_nuevo_lista', 'GET', '0' );\"> Normal";
      echo "<input type=\"radio\" name=\"tipo_producto\" value=\"2\" onclick=\"cargar_datos( 'id=". $_GET["id"]. "&mov=agregar_producto&ver=1', 'formulario_producto_nuevo_lista', 'GET', '0' );\">Kit<br>";
      echo "ID: <input type=\"text\" name=\"id_producto\"><br>";
      echo "Cantidad: <input type=\"text\" name=\"cantidad_producto\" style=\"width:50px;\"> ";
      echo "<select name=\"unidad_medida_producto\" style=\"width:120px;\">";
         echo "<option value=\"error\"></option>";

         $cons= consultar_enorden( "UNIDADES_MEDIDA", "ID" );
         while( $buf= mysql_fetch_array($cons) )
            echo "<option>". $buf["NOMBRE"]. "/". $buf["NOTACION"]. "</option>";
         unset($buf);
         unset($cons);
      echo "</select>";
      echo "<br>";
      echo "Nombre del Prod.: <input type=\"text\" name=\"nombre_producto\"><br>";
      echo "Precio Publico: <input type=\"text\" name=\"preciopublico_producto\"><br>";
      echo "Categoria: <select name=\"categoria_producto\" onchange=\"cargar_datos( 'id=". $_GET["id"]. "&mov=mostrar_secciones&categoria_id='+this.value, 'mostrar_secciones', 'GET', '0' );\">";
         echo "<option value=\"error\"></option>";
         
      $cons= consultar_enorden( "MENUS", "ID" );
      while( $buf= mysql_fetch_array($cons) )
         echo "<option value=\"". $buf["ID"]. "\">". $buf["NOMBRE"]. "</option>";            
      unset($buf);
      unset($cons);
         
      echo "</select>";
      echo "<div id=\"mostrar_secciones\"></div>";
      echo "Descripcion:<br>";
      echo "<textarea name=\"descripcion_producto\"></textarea><br>";
      echo "<span style=\"font-size:10px;\">Solo se permite adjuntar imagenes: <b>*.jpg</b>, <b>*.png</b> y <b>*.gif</b>.</span>";
      echo "<div id=\"formulario_producto_nuevo_imagenes\">";
      echo "<input type=\"file\" name=\"imagen_productos01\" style=\"font-size:9px;\">";
      echo "<input type=\"file\" name=\"imagen_productos02\" style=\"font-size:9px;\">";
      echo "</div>";
      echo "</div>";

      echo "<div id=\"formulario_producto_nuevo_lista\">";
      echo "</div>";
      echo "<center>";
      echo "<input type=\"submit\" value=\"Guardar Producto\" style=\"text-align:center;border:solid 1px black;font-family:verdana;font-size:12px;font-weight:bold;\">";
      echo "</center>";
      echo "</form>";
      break;
   }
?>



AJAX.PHP

Código :

<?php
   /*####################################
   ######      MOSTRAR SECCIONES      #####
   ##      Muestra secciones en capa      ##
   ######################################*/   
   else if( !strcmp( $_GET["mov"], "mostrar_secciones") )
      {
      $xcons= consultar_con( "MENUS", "ID='". $_GET["categoria_id"]. "'" );
      $xbuf= mysql_fetch_array($xcons);
      unset($xcons);
      $cons_sec= consultar_enorden_con( "SECCIONES", "RELACION='". $xbuf["NOMBRE"]. "'", "ID" );
      unset($xbuf);
      
      echo "Secciones: <select name=\"seccion_producto\">";
         echo "<option value=\"error\"></option>";
         while( $buf_sec= mysql_fetch_array($cons_sec) )
            echo "<option value=\"". $buf_sec["ID"]. "\">". $buf_sec["NOMBRE"]. "</option>";
      echo "</select>";
      
      unset($buf_sec);
      unset($cons_sec);
      }
?>



SCRIPT.js

Código :

//Funcion para obtener conector AJAX
function ajax()
   {
   var pagina=false; //conector ajax
   
   if( window.XMLHttpRequest ) //Navegador Firefox
      pagina= new XMLHttpRequest(); //creamos objeto para el navegador
   else if( window.ActiveXObject ) //Navegador Internet Explorer
      {
      try //Version Actual
         {
         pagina= new ActiveXObject( "Msxml2.XMLHTTP" ); //creamos objeto para el navegador
         }
      catch(e) //version Antigua
         {
         try
            {
            pagina= new ActiveXObject( "Microsoft.XMLHTTP" ); //creamos objeto para el navegador
            }
         catch(e)
            {
            }
         }
      }
   return pagina;
   }
   
function cargar_datos( vars, capaview, flujoddatos, varsform )
   {
   var conector, capa, url;
   
   url= 'ajax.php'; //mis funciones para ajax
   capa= document.getElementById(capaview);
   
   conector= ajax();
   conector.open( flujoddatos, url+'?'+vars, true );
   conector.onreadystatechange= function()
      {
      if( conector.readyState==1 )
         {
         capa.innerHTML= "<center><img src='../admin/imagenes/loading.gif'><br><b>CARGANDO...</b></center>";
         }
      else if( conector.readyState==4 )
         {
         if( conector.status==200 )
            {
            if( varsform!=0 )
               conector.setRequestHeader( "Content-Type", "application/x-www-form-urlencoded" );
            capa.innerHTML= conector.responseText;
            }
         else if( conector.status==404 )
            {
            capa.innerHTML= "La pagina que intentas cargar no existe...";
            }
         else
            {
            capa.innerHTML= conector.status;
            }
         }
      }
   //conector.setRequestHeader( "Content-Type", "multipart/form-data" );
   if( varsform!=0 )
      {
      var myarr= varsform.split(':'); //dividimos
      var trama="";
      var i=0;
      
      for( i=0; i<(myarr.length); i++ )
         {
         if( i>0 )
            trama += "&";
         trama += myarr[i]+"="+document.getElementById(myarr[i]).value;
         }
      alert(trama);

      conector.setRequestHeader( "Content-Type", "application/x-www-form-urlencoded" );
      conector.send(trama);
      }
   else
      conector.send(null);
   }

Por Diabliyo

9 de clabLevel



Genero:Masculino  

firefox
Citar            
MensajeEscrito el 13 Ago 2008 08:05 pm
Debido a que se ve demasiado amontonado con muy poca visibilidad y es ostigante como se muestra el codigo...

Aqui dejo un link a pastebind:

http://pastebin.com/d3d73d046

Por Diabliyo

9 de clabLevel



Genero:Masculino  

firefox
Citar            
MensajeEscrito el 13 Ago 2008 08:06 pm
y si mandas la categoria y la seccion por get?

pd: no he revisado todo el codigo

Por gcm

Claber

557 de clabLevel

3 tutoriales

Genero:Masculino  

Diseñador Grafico y Web, Geek

firefox
Citar            
MensajeEscrito el 13 Ago 2008 08:09 pm
Es un formulario, debe ser procesado por POST, ya que esto de POST y GET lo puedes manejar en AJAX, pero en el caso de formulario las variables (INPUT's) siempre se manejaran por POST debido a la configuracion de PHP.

register_globals= off

En fin, porfavor revisen el codigo antes de postear, ya que este tipo de cuestiones no bienen al caso :S !!... Aparte evitamos que cresca el hilo !!

Por Diabliyo

9 de clabLevel



Genero:Masculino  

firefox
Citar            
MensajeEscrito el 13 Ago 2008 08:11 pm
Aparte es logico :S....

Los unicos que viajan por el flujo de datos GET son variables directamente de un link <a>, y los POST son directamente de un formulario....

Por Diabliyo

9 de clabLevel



Genero:Masculino  

firefox
Citar            
MensajeEscrito el 13 Ago 2008 09:10 pm
Saludos,

Veo que el problema no esta en la petición sino en la forma en la que etsas obteniendo los valores de los campos.
Debes descriminar el tipo de campo para así saber como extraer su valor.

document.getElementById(myarr[i]).value //para campos de texto

document.getElementById(myarr[i]).options[ document.getElementById(myarr[i]).selectedIndex ].value //para campos de texto


Creo que este puede ser el problema.

Saludos.

Por johnx

7 de clabLevel



Genero:Masculino  

firefox
Citar            
MensajeEscrito el 13 Ago 2008 09:11 pm
Perdón,

document.getElementById(myarr[i]).options[ document.getElementById(myarr[i]).selectedIndex ].value //para campos select

Por johnx

7 de clabLevel



Genero:Masculino  

firefox
Citar            
MensajeEscrito el 13 Ago 2008 10:52 pm
Pues no, eso no es...

Ya que si observas un poco el codigo, eso que mencionas solo se pude realizar cuando varsform!=0, vaya, eso lo ocupo solamente cuando quiero tratar variable de un formulario en donde quiero pasar TODAS las variables por el metodo POST hacia otra hoja (invocado con AJAX), vaya, seria mas que nada eso para enviar variables POST. En mi caso del SELECT yo envio ese argumento con 0, lo cual no se cumple el condicional y es aparte del codigo jamas de ejecuta.

Observa bien, asi lo invoco el primer select (que es el que carga el segundo select):

Código :

echo "Categoria: <select name=\"categoria_producto\" onchange=\"cargar_datos( 'id=". $_GET["id"]. "&mov=mostrar_secciones&categoria_id='+this.value, 'mostrar_secciones', 'GET', '0' );\">";


Como ves, el ultimo argumento de la funcion cargar_datos(), es '0', asi que lo que tu mencionas jamas se ejecuta :D !!...

El problema es otro, el cual no creo que sea tanto de AJAX, o posiblemente si, en fin... Solo puedo afirmar que AJAX pasa bien los datos a la hoja AJAX.PHP ya que esta hoja imprime el segundo SELECT el cual deberia establecer un valor en la variable "seccion_producto" disponible una vez enviado el formulario...

Observen bien el code, si es que quieren ayudar, por favor, asi no hacemos mas ponderante el hilo con afirmaciones poco observativas !!

bye bye

Por Diabliyo

9 de clabLevel



Genero:Masculino  

firefox
Citar            
MensajeEscrito el 13 Ago 2008 10:54 pm
He actualizaco el PASTEBIND donde esta el codigo aun mas reducido y mejor...

http://pastebin.com/d3b3e32cc

Por Diabliyo

9 de clabLevel



Genero:Masculino  

firefox

 

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