Foros del Web » Programando para Internet » Javascript » Frameworks JS »

Funcion en Paneles

Estas en el tema de Funcion en Paneles en el foro de Frameworks JS en Foros del Web. Hola, alguien me podría decir como lo hago para que en una tabla donde tengo distintas solapas, cuando pulse una de ellas me haga automaticamente ...

  #1 (permalink)  
Antiguo 25/09/2012, 11:38
Avatar de satjaen  
Fecha de Ingreso: septiembre-2012
Ubicación: Jaén (Andalucía)
Mensajes: 893
Antigüedad: 7 años, 4 meses
Puntos: 10
Funcion en Paneles

Hola, alguien me podría decir como lo hago para que en una tabla donde tengo distintas solapas, cuando pulse una de ellas me haga automaticamente un php?
<li class="TabbedPanelsTab" tabindex="0">Usuarios</li>
<li class="TabbedPanelsTab" tabindex="0">Aparatos</li>
<li class="TabbedPanelsTab" tabindex="0">Intervenciones</li>


Dejo el cod:

Código PHP:
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. <script type="text/javascript" src="assets/js/jquery-1.7.2.min.js"></script>
  5. <script type="text/javascript" src="assets/jqueryui/js/jquery-ui-1.8.16.custom.min.js"></script>
  6. <script type="text/javascript" src="assets/js/js.js"></script>
  7. <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
  8. <title>Documento sin título</title>
  9. <link href="estilo1.css" rel="stylesheet" type="text/css" />
  10. <script src="SpryAssets/SpryTabbedPanels.js" type="text/javascript"></script>
  11. <link href="SpryAssets/SpryTabbedPanels.css" rel="stylesheet" type="text/css" />
  12.   <script>  
  13. function enviar_formulario(){
  14.    document.form1.submit()
  15. }
  16. </script>
  17.  <script>
  18. function enviar_formulario1(){
  19.   document.form1.reset();
  20. }
  21. </script>
  22. <script>
  23. function enviar()
  24. {  
  25. var formulario = document.getElementById("");      
  26. var dato = formulario[0];  
  27. if (dato.value=="enviar"){     
  28. alert("Enviando el formulario");       
  29. formulario.submit();       
  30. return true;   
  31. } else {       
  32. alert("No se envía el formulario");    
  33. return false;   }}
  34. </script>
  35. </head>
  36. <body>
  37. <div id="contenedor">
  38. <div id="cabecera">Consulta de intervenciones</div>
  39. <div id="tabla">
  40.     <div id="formulario">
  41.     <form id="frm_filtro" method="post" action="" name="">
  42.             <table width="685">
  43.   <tr>
  44.     <td width="9%" class="campo_apellidos2">Teléfonos</td>
  45.     <td width="9%"><input  name="telefono" type="text" size="9" /></td>
  46.     <td width="9%"><input onkeydown="prueba(event)" name="telefono2" type="text" id="telefono2" size="9" /></td>
  47.     <td width="9%"><input name="telefono3" type="text" id="telefono3" size="9" /></td>
  48.     <td width="32%">&nbsp;</td>
  49.     <td width="18%" class="campo_apellidos2">NIF</td>
  50.     <td width="14%"><input name="NIF" type="text" id="NIF" size="9" /></td>
  51.   </tr>
  52.   <tr>
  53.     <td class="campo_apellidos2">Nombre</td>
  54.     <td colspan="4"><input name="nombre_apellidos" type="text" size="30" />
  55.     <td>&nbsp;</td>
  56.     <td>&nbsp;</td>
  57.   </tr>
  58.   <tr>
  59.     <td class="campo_apellidos2">Localidad</td>
  60.     <td colspan="4"><input name="poblacion" type="text" size="30" />
  61.       <span class="campo_apellidos2">C.Postal</span>      <input name="cod_postal" type="text" id="cod_postal" size="5" /></td>
  62.     <td class="campo_apellidos2">Provincia</td>
  63.     <td><input name="provincia" type="text" size="9" /></td>
  64.   </tr>
  65.   <tr>
  66.     <td class="campo_apellidos2">Calle</td>
  67.     <td colspan="4"><input name="calle" type="text" id="calle" size="45" />
  68.       <span class="campo_apellidos2"></span>      <input name="numero" type="text" id="numero" size="5" /></td>
  69.     <td class="campo_apellidos2">Edificio</td>
  70.     <td><input name="edificio" type="text" id="edificio" size="5" /></td>
  71.   </tr>
  72.   <tr>
  73.     <td class="campo_apellidos2">Puerta</td>
  74.     <td colspan="3"><input name="puerta" type="text" id="puerta" size="5" />
  75.       <span class="campo_apellidos2">      Piso</span>
  76.       <input name="piso" type="text" id="piso" size="5" />
  77.       <span class="campo_apellidos2">Letra</span>        <input name="letra" type="text" id="letra" size="5" /></td>
  78.     <td>&nbsp;</td>
  79.     <td><span class="campo_apellidos2">Nº Mante.</span></td>
  80.     <td><input name="mantenimiento" type="text" id="mantenimiento" size="5" /></td>
  81.   </tr>
  82.   </table>
  83.   <table width="100%">
  84.   <tr>
  85.     <th scope="col"><button type="button"  id="btnfiltrar" name="btnfiltrar" style="border:0; margin:0; padding:0;cursor:pointer">
  86.   <img src="imagenes_menu/boton_buscar.png"/>
  87. </button>
  88. </th>
  89.   </tr>
  90. </table>                
  91.           </form>        
  92.  
  93.     </div>
  94.     <div id="paneles">
  95.       <div id="TabbedPanels1" class="TabbedPanels">
  96.         <ul class="TabbedPanelsTabGroup">
  97.           <li class="TabbedPanelsTab" tabindex="0">Usuarios</li>
  98.           <li class="TabbedPanelsTab" tabindex="0">Aparatos</li>
  99.           <li class="TabbedPanelsTab" tabindex="0">Intervenciones</li>
  100. </ul>
  101.         <div class="TabbedPanelsContentGroup">
  102.           <div class="TabbedPanelsContent">
  103.            <div id="usuario">
  104.             <table width="100%" id="data" class="table-dg-grid" >
  105.              <thead>
  106.               <tr>
  107.        <tr bgcolor=#DFEBFF id=t70 onclick='coloreaf(70,1)' onMouseOver='coloreamosin(70,1)' onMouseOut='coloreamosout(70,1)'>
  108.                    <th><span title="num_usuario">Nº Usuario</span></th>
  109.                     <th><span title="telefono">Teléfono</span></th>
  110.                     <th><span title="nombre">Nombre</span></th>
  111.                     <th><span title="poblacion">Población</span></th>  
  112.                      </tr>
  113.                 </thead>
  114.                 <tbody>
  115.                 </tbody>
  116.             </table>
  117.                 </div>
  118.           </div>
  119.           <div class="TabbedPanelsContent"><table width="100%" id="data1">
  120.            <thead>
  121.   <tr>
  122.                     <th><span title="aparato"></span></th>
  123.                     <th><span title="marca"></span></th>
  124.                     <th><span title="modelo"></span></th>
  125.                     <th><span title="NUM_SERIE"></span></th>
  126.                     <th><span title="num_PRODUCTO"></span></th>
  127.                     <th><span title="FECHA_compra"></span></th>
  128.    </tr>
  129.                 </thead>
  130.                 <tbody>
  131.                 </tbody>
  132. </table>
  133. </div>
  134.           <div class="TabbedPanelsContent">
  135.            
  136.           <table cellpadding="0" cellspacing="0" id="data2">
  137.                 <thead>
  138.                   <tr>
  139.                     <th><span title="num_aviso"></span></th>
  140.                     <th><span title="num_usuario"></span></th>
  141.                     <th><span title="aparato"></span></th>
  142.                     <th><span title="calle"></span></th>
  143.                     <th><span title="fecha_recepcion"></span></th>
  144.                     <th><span title="fecha_recepcion"></span></th>
  145.                     <th><span title="sintoma"></span></th>
  146.                   </tr>
  147.                 </thead>
  148.                 <tbody>
  149.                 </tbody>
  150.               </table>            
  151.           </div>
  152. </div>
  153.       </div>
  154.       <table width="100%">
  155.         <tr>
  156. <th scope="col"><a class="" href="javascript:enviar_formulario()"><span></span><img src="imagenes_menu/generar_aviso1.png" width="150" height="40" border="0"/></a>
  157. </th>
  158.           <th scope="col">&nbsp;</th>
  159.           <th scope="col"></th>
  160.           <th scope="col"><a class="" href="javascript:enviar_formulario1()"><span></span><img src="imagenes_menu/boton_salir.png" width="150" height="40" border="0"/></a>
  161.  </th>
  162.         </tr>
  163.       </table>
  164.     </div>
  165. </div>
  166. </div>
  167. <script type="text/javascript">
  168. var TabbedPanels1 = new Spry.Widget.TabbedPanels("TabbedPanels1");
  169. </script>
  170. </body>
  171. </html>
  #2 (permalink)  
Antiguo 26/09/2012, 02:45
Avatar de satjaen  
Fecha de Ingreso: septiembre-2012
Ubicación: Jaén (Andalucía)
Mensajes: 893
Antigüedad: 7 años, 4 meses
Puntos: 10
Respuesta: Funcion en Paneles

Hola, hay alguien por aquí?

Hola, lo que quisiera es que la solapa:
<li class="TabbedPanelsTab" tabindex="0">Aparatos</li>
Automaticamente al pulsarla me hiciera un select php con una variable recogida de la anterior pestaña:
<li class="TabbedPanelsTab" tabindex="0">Usuarios</li>
Para saber los aparatos que el usuarios tiene en su domicilio.

No se si me explico.

Última edición por satjaen; 26/09/2012 a las 10:40
  #3 (permalink)  
Antiguo 27/09/2012, 09:46
Avatar de satjaen  
Fecha de Ingreso: septiembre-2012
Ubicación: Jaén (Andalucía)
Mensajes: 893
Antigüedad: 7 años, 4 meses
Puntos: 10
Respuesta: Funcion en Paneles

Por favor, no hay nadie que me quiera contestar?
  #4 (permalink)  
Antiguo 27/09/2012, 09:54
Avatar de Dradi7  
Fecha de Ingreso: junio-2008
Ubicación: Peru - Lima
Mensajes: 1.518
Antigüedad: 11 años, 7 meses
Puntos: 220
Respuesta: Funcion en Paneles

Para esto debes usar ajax busca informacion en la web existe muchos ejemplos lo unico que deberias hacer es crear un evento al momento de hacer click en tu panel para realizar el ajax.

Ejemplo:

Código HTML:
Ver original
  1. <li class="TabbedPanelsTab" tabindex="0" onclick="buscarAparatos();">Aparatos</li>

Código Javascript:
Ver original
  1. function createAjax(){
  2.    if (window.XMLHttpRequest)
  3.    {
  4.       xmlhttp=new XMLHttpRequest();
  5.    }
  6.    else
  7.    {
  8.       xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
  9.    }
  10. }
  11.  
  12. function buscarAparato()
  13. {
  14.     createAjax();
  15.     xmlhttp.onreadystatechange=function()
  16.     {
  17.         if (xmlhttp.readyState==4 && xmlhttp.status==200)
  18.         {
  19.             document.getElementById("myDiv").innerHTML=xmlhttp.responseText;
  20.         }
  21.     }
  22.     xmlhttp.open("GET","buscarAparato.php",true);
  23.     xmlhttp.send("ID=4");
  24. }
__________________
La clave de todo triunfador es eliminar todas sus excusas y sus limitaciones
  #5 (permalink)  
Antiguo 28/09/2012, 02:11
Avatar de satjaen  
Fecha de Ingreso: septiembre-2012
Ubicación: Jaén (Andalucía)
Mensajes: 893
Antigüedad: 7 años, 4 meses
Puntos: 10
Respuesta: Funcion en Paneles

Dradi7 otra vez gracias, bueno como tu ya sabes que en estos menesteres ando bastante verde me podrías decir donde pongo la variable de la pestaña usuarios que en este caso es num_usuario para pasarla a la pestaña aparatos?

He modificado el cod y al pulsar en Aparatos no me funciona.
Aquí esta cod

Código PHP:
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. <script type="text/javascript" src="assets/js/jquery-1.7.2.min.js"></script>
  5. <script type="text/javascript" src="assets/jqueryui/js/jquery-ui-1.8.16.custom.min.js"></script>
  6. <script type="text/javascript" src="assets/js/js.js"></script>
  7. <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
  8. <title>Documento sin título</title>
  9. <link href="estilo1.css" rel="stylesheet" type="text/css" />
  10. <script src="SpryAssets/SpryTabbedPanels.js" type="text/javascript"></script>
  11. <link href="SpryAssets/SpryTabbedPanels.css" rel="stylesheet" type="text/css" />
  12. <script type="text/javascript">
  13. $(document).ready(function() {    
  14.     $('.button').click(function(){
  15.  
  16.         //Añadimos la imagen de carga en el contenedor
  17.         $('#content').html('<div><img src="imagenes_menu/ajax-loader.gif"/></div>');
  18.  
  19.         var page = $(this).attr('data');        
  20.         var dataString = 'page='+page;
  21.    
  22.         $.ajax({
  23.             type: "GET",
  24.             url: "includes/archivo.php",
  25.             data: dataString,
  26.             success: function(data) {
  27.                 //Cargamos finalmente el contenido deseado
  28.                 $('#content').fadeIn(1000).html(data);
  29.             }
  30.         });
  31.     });              
  32. });    
  33. </script>
  34.   <script>
  35. function enviar_formulario(){
  36.    document.form1.submit()
  37. }
  38. </script>
  39.  <script>
  40. function createAjax(){
  41.    if (window.XMLHttpRequest)
  42.    {
  43.       xmlhttp=new XMLHttpRequest();
  44.    }
  45.    else
  46.    {
  47.       xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
  48.    }
  49. }
  50.  
  51. function buscarAparatos()
  52. {
  53.     createAjax();
  54.     xmlhttp.onreadystatechange=function()
  55.     {
  56.         if (xmlhttp.readyState==4 && xmlhttp.status==200)
  57.         {
  58.             document.getElementById("myDiv").innerHTML=xmlhttp.responseText;
  59.         }
  60.     }
  61.     xmlhttp.open("GET","buscarAparato.php",true);
  62.     xmlhttp.send("ID=4");
  63. }
  64. </script>
  65.  <script>
  66. function enviar_formulario1(){
  67.   document.form1.reset();
  68. }
  69. </script>
  70. <script>
  71. function enviar()
  72. {  
  73. var formulario = document.getElementById("");      
  74. var dato = formulario[0];  
  75. if (dato.value=="enviar"){     
  76. alert("Enviando el formulario");       
  77. formulario.submit();       
  78. return true;   
  79. } else {       
  80. alert("No se envía el formulario");    
  81. return false;   }}
  82. </script>
  83. </head>
  84. <body>
  85. <div id="contenedor">
  86. <div id="cabecera">Consulta de intervenciones</div>
  87. <div id="tabla">
  88.     <div id="formulario">
  89.     <form id="frm_filtro" method="post" action="menu1.php" name="form1">
  90.             <table width="685">
  91.   <tr>
  92.     <td width="9%" class="campo_apellidos2">Teléfonos</td>
  93.     <td width="9%"><input name="telefono" type="text" size="9" /></td>
  94.     <td width="9%"><input name="telefono2" type="text" id="telefono2" size="9" /></td>
  95.     <td width="9%"><input name="telefono3" type="text" id="telefono3" size="9" /></td>
  96.     <td width="32%">&nbsp;</td>
  97.     <td width="18%" class="campo_apellidos2">NIF</td>
  98.     <td width="14%"><input name="NIF" type="text" id="NIF" size="9" /></td>
  99.   </tr>
  100.   <tr>
  101.     <td class="campo_apellidos2">Nombre</td>
  102.     <td colspan="4"><input name="nombre_apellidos" type="text" size="30" />
  103.     <td>&nbsp;</td>
  104.     <td>&nbsp;</td>
  105.   </tr>
  106.   <tr>
  107.     <td class="campo_apellidos2">Localidad</td>
  108.     <td colspan="4"><input name="poblacion" type="text" size="30" />
  109.       <span class="campo_apellidos2">C.Postal</span>      <input name="cod_postal" type="text" id="cod_postal" size="5" /></td>
  110.     <td class="campo_apellidos2">Provincia</td>
  111.     <td><input name="provincia" type="text" size="9" /></td>
  112.   </tr>
  113.   <tr>
  114.     <td class="campo_apellidos2">Calle</td>
  115.     <td colspan="4"><input name="calle" type="text" id="calle" size="45" />
  116.       <span class="campo_apellidos2">Nº</span>      <input name="numero" type="text" id="numero" size="5" /></td>
  117.     <td class="campo_apellidos2">Edificio</td>
  118.     <td><input name="edificio" type="text" id="edificio" size="5" /></td>
  119.   </tr>
  120.   <tr>
  121.     <td class="campo_apellidos2">Puerta</td>
  122.     <td colspan="3"><input name="puerta" type="text" id="puerta" size="5" />
  123.       <span class="campo_apellidos2">      Piso</span>
  124.       <input name="piso" type="text" id="piso" size="5" />
  125.       <span class="campo_apellidos2">Letra</span>        <input name="letra" type="text" id="letra" size="5" /></td>
  126.     <td>&nbsp;</td>
  127.     <td><span class="campo_apellidos2">Nº Mante.</span></td>
  128.     <td><input name="mantenimiento" type="text" id="mantenimiento" size="5" /></td>
  129.   </tr>
  130.   </table>
  131.   <table width="100%">
  132.   <tr>
  133.     <th scope="col"><button type="button"  id="btnfiltrar" name="btnfiltrar" style="border:0; margin:0; padding:0;cursor:pointer">
  134.   <img src="imagenes_menu/boton_buscar.png"/>
  135. </button>
  136. </th>
  137.   </tr>
  138. </table>                
  139.           </form>        
  140.  
  141.     </div>
  142.     <div id="paneles">
  143.       <div id="TabbedPanels1" class="TabbedPanels">
  144.         <ul class="TabbedPanelsTabGroup">
  145.           <li class="TabbedPanelsTab" tabindex="0">Usuarios</li>
  146.           <li class="TabbedPanelsTab" tabindex="0" onclick="buscarAparatos();">Aparatos</li>
  147.           <li class="TabbedPanelsTab" tabindex="0">Intervenciones</li>
  148. </ul>
  149.         <div class="TabbedPanelsContentGroup">
  150.           <div class="TabbedPanelsContent">
  151.            <div id="usuario">
  152.             <table width="100%" id="data" class="table-dg-grid" >
  153.              <thead>
  154.               <tr>
  155.        <tr bgcolor=#DFEBFF id=t70 onclick='coloreaf(70,1)' onMouseOver='coloreamosin(70,1)' onMouseOut='coloreamosout(70,1)'>
  156.                     <th><span title="nu_usuario">Nº Usuario</span></th>
  157.                     <th><span title="telefono">Teléfono</span></th>
  158.                     <th><span title="nombre">Nombre</span></th>
  159.                     <th><span title="poblacion">Población</span></th>  
  160.                      </tr>
  161.                 </thead>
  162.                 <tbody>
  163.                 </tbody>
  164.             </table>
  165.                 </div>
  166.           </div>
  167.           <div class="TabbedPanelsContent"><table width="100%" id="data1">
  168.            <thead>
  169.   <tr>
  170.                     <th><span title="aparato"></span></th>
  171.                     <th><span title="marca"></span></th>
  172.                     <th><span title="modelo"></span></th>
  173.                     <th><span title="NUM_SERIE"></span></th>
  174.                     <th><span title="num_PRODUCTO"></span></th>
  175.                     <th><span title="FECHA_compra"></span></th>
  176.    </tr>
  177.                 </thead>
  178.                 <tbody>
  179.                 </tbody>
  180. </table>
  181. </div>
  182.           <div class="TabbedPanelsContent">
  183.            
  184.           <table cellpadding="0" cellspacing="0" id="data2">
  185.                 <thead>
  186.                   <tr>
  187.                     <th><span title="num_aviso"></span></th>
  188.                     <th><span title="num_usuario"></span></th>
  189.                     <th><span title="aparato"></span></th>
  190.                     <th><span title="calle"></span></th>
  191.                     <th><span title="fecha_recepcion"></span></th>
  192.                     <th><span title="fecha_recepcion"></span></th>
  193.                     <th><span title="sintoma"></span></th>
  194.                   </tr>
  195.                 </thead>
  196.                 <tbody>
  197.                 </tbody>
  198.               </table>            
  199.           </div>
  200. </div>
  201.       </div>
  202.       <table width="100%">
  203.         <tr>
  204. <th scope="col"><a class="" href="javascript:enviar_formulario()"><span></span><img src="imagenes_menu/generar_aviso1.png" width="150" height="40" border="0"/></a>
  205. </th>
  206.           <th scope="col">&nbsp;</th>
  207.           <th scope="col"></th>
  208.           <th scope="col"><a class="" href="javascript:enviar_formulario1()"><span></span><img src="imagenes_menu/boton_salir.png" width="150" height="40" border="0"/></a>
  209.  </th>
  210.         </tr>
  211.       </table>
  212.     </div>
  213. </div>
  214. </div>
  215. <script type="text/javascript">
  216. var TabbedPanels1 = new Spry.Widget.TabbedPanels("TabbedPanels1");
  217. </script>
  218. </body>
  219. </html>
  220. <?php
  221. mysql_free_result($Recordset1);
  222. ?>

Muchas gracias por tu paciencia.

Última edición por satjaen; 28/09/2012 a las 06:40
  #6 (permalink)  
Antiguo 28/09/2012, 06:43
Avatar de satjaen  
Fecha de Ingreso: septiembre-2012
Ubicación: Jaén (Andalucía)
Mensajes: 893
Antigüedad: 7 años, 4 meses
Puntos: 10
Respuesta: Funcion en Paneles

Por favor, ayuda.
  #7 (permalink)  
Antiguo 28/09/2012, 10:30
Avatar de Dradi7  
Fecha de Ingreso: junio-2008
Ubicación: Peru - Lima
Mensajes: 1.518
Antigüedad: 11 años, 7 meses
Puntos: 220
Respuesta: Funcion en Paneles

mira si estas usando jQuery agregale a tu variable los demas parametros+

var dataString = 'page='+page+'&num_usuario='+num_usuario;


En caso que estes usando lo que yo te pase solamente cambiale al

xmlhttp.send("ID=4");

agregandole por ejemplo tu variable ya creada arriba
__________________
La clave de todo triunfador es eliminar todas sus excusas y sus limitaciones
  #8 (permalink)  
Antiguo 28/09/2012, 11:43
Avatar de satjaen  
Fecha de Ingreso: septiembre-2012
Ubicación: Jaén (Andalucía)
Mensajes: 893
Antigüedad: 7 años, 4 meses
Puntos: 10
Respuesta: Funcion en Paneles

Hola, lo que estoy utilizando ya lo ves en el cod de#5 (permalink, pero te lo vuelvo a poner con la variable xmlhttp.send("ID=num_usuario"); para que por favor lo revises porque ya te digo al pulsar en Aparatos no me carga el php.

Código PHP:
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. <script type="text/javascript" src="assets/js/jquery-1.7.2.min.js"></script>
  5. <script type="text/javascript" src="assets/jqueryui/js/jquery-ui-1.8.16.custom.min.js"></script>
  6. <script type="text/javascript" src="assets/js/js.js"></script>
  7. <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
  8. <title>Documento sin título</title>
  9. <link href="estilo1.css" rel="stylesheet" type="text/css" />
  10. <script src="SpryAssets/SpryTabbedPanels.js" type="text/javascript"></script>
  11. <link href="SpryAssets/SpryTabbedPanels.css" rel="stylesheet" type="text/css" />
  12. <script type="text/javascript">
  13. $(document).ready(function() {    
  14.     $('.button').click(function(){
  15.  
  16.         //Añadimos la imagen de carga en el contenedor
  17.         $('#content').html('<div><img src="imagenes_menu/ajax-loader.gif"/></div>');
  18.  
  19.         var page = $(this).attr('data');        
  20.         var dataString = 'page='+page;
  21.    
  22.         $.ajax({
  23.             type: "GET",
  24.             url: "includes/archivo.php",
  25.             data: dataString,
  26.             success: function(data) {
  27.                 //Cargamos finalmente el contenido deseado
  28.                 $('#content').fadeIn(1000).html(data);
  29.             }
  30.         });
  31.     });              
  32. });    
  33. </script>
  34.   <script>
  35. function enviar_formulario(){
  36.    document.form1.submit()
  37. }
  38. </script>
  39.  <script>
  40. function createAjax(){
  41.    if (window.XMLHttpRequest)
  42.    {
  43.       xmlhttp=new XMLHttpRequest();
  44.    }
  45.    else
  46.    {
  47.       xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
  48.    }
  49. }
  50.  
  51. function buscarAparatos()
  52. {
  53.     createAjax();
  54.     xmlhttp.onreadystatechange=function()
  55.     {
  56.         if (xmlhttp.readyState==4 && xmlhttp.status==200)
  57.         {
  58.             document.getElementById("myDiv").innerHTML=xmlhttp.responseText;
  59.         }
  60.     }
  61.     xmlhttp.open("GET","buscarAparato.php",true);
  62.     xmlhttp.send("ID=num_usuario");
  63. }
  64. </script>
  65.  <script>
  66. function enviar_formulario1(){
  67.   document.form1.reset();
  68. }
  69. </script>
  70. <script>
  71. function enviar()
  72. {  
  73. var formulario = document.getElementById("");      
  74. var dato = formulario[0];  
  75. if (dato.value=="enviar"){     
  76. alert("Enviando el formulario");       
  77. formulario.submit();       
  78. return true;   
  79. } else {       
  80. alert("No se envía el formulario");    
  81. return false;   }}
  82. </script>
  83. </head>
  84. <body>
  85. <div id="contenedor">
  86. <div id="cabecera">Consulta de intervenciones</div>
  87. <div id="tabla">
  88.     <div id="formulario">
  89.     <form id="frm_filtro" method="post" action="menu1.php" name="form1">
  90.             <table width="685">
  91.   <tr>
  92.     <td width="9%" class="campo_apellidos2">Teléfonos</td>
  93.     <td width="9%"><input name="telefono" type="text" size="9" /></td>
  94.     <td width="9%"><input name="telefono2" type="text" id="telefono2" size="9" /></td>
  95.     <td width="9%"><input name="telefono3" type="text" id="telefono3" size="9" /></td>
  96.     <td width="32%">&nbsp;</td>
  97.     <td width="18%" class="campo_apellidos2">NIF</td>
  98.     <td width="14%"><input name="NIF" type="text" id="NIF" size="9" /></td>
  99.   </tr>
  100.   <tr>
  101.     <td class="campo_apellidos2">Nombre</td>
  102.     <td colspan="4"><input name="nombre_apellidos" type="text" size="30" />
  103.     <td>&nbsp;</td>
  104.     <td>&nbsp;</td>
  105.   </tr>
  106.   <tr>
  107.     <td class="campo_apellidos2">Localidad</td>
  108.     <td colspan="4"><input name="poblacion" type="text" size="30" />
  109.       <span class="campo_apellidos2">C.Postal</span>      <input name="cod_postal" type="text" id="cod_postal" size="5" /></td>
  110.     <td class="campo_apellidos2">Provincia</td>
  111.     <td><input name="provincia" type="text" size="9" /></td>
  112.   </tr>
  113.   <tr>
  114.     <td class="campo_apellidos2">Calle</td>
  115.     <td colspan="4"><input name="calle" type="text" id="calle" size="45" />
  116.       <span class="campo_apellidos2">Nº</span>      <input name="numero" type="text" id="numero" size="5" /></td>
  117.     <td class="campo_apellidos2">Edificio</td>
  118.     <td><input name="edificio" type="text" id="edificio" size="5" /></td>
  119.   </tr>
  120.   <tr>
  121.     <td class="campo_apellidos2">Puerta</td>
  122.     <td colspan="3"><input name="puerta" type="text" id="puerta" size="5" />
  123.       <span class="campo_apellidos2">      Piso</span>
  124.       <input name="piso" type="text" id="piso" size="5" />
  125.       <span class="campo_apellidos2">Letra</span>        <input name="letra" type="text" id="letra" size="5" /></td>
  126.     <td>&nbsp;</td>
  127.     <td><span class="campo_apellidos2">Nº Mante.</span></td>
  128.     <td><input name="mantenimiento" type="text" id="mantenimiento" size="5" /></td>
  129.   </tr>
  130.   </table>
  131.   <table width="100%">
  132.   <tr>
  133.     <th scope="col"><button type="button"  id="btnfiltrar" name="btnfiltrar" style="border:0; margin:0; padding:0;cursor:pointer">
  134.   <img src="imagenes_menu/boton_buscar.png"/>
  135. </button>
  136. </th>
  137.   </tr>
  138. </table>                
  139.           </form>        
  140.  
  141.     </div>
  142.     <div id="paneles">
  143.       <div id="TabbedPanels1" class="TabbedPanels">
  144.         <ul class="TabbedPanelsTabGroup">
  145.           <li class="TabbedPanelsTab" tabindex="0">Usuarios</li>
  146.           <li class="TabbedPanelsTab" tabindex="0" onclick="buscarAparatos();">Aparatos</li>
  147.           <li class="TabbedPanelsTab" tabindex="0">Intervenciones</li>
  148. </ul>
  149.         <div class="TabbedPanelsContentGroup">
  150.           <div class="TabbedPanelsContent">
  151.            <div id="usuario">
  152.             <table width="100%" id="data" class="table-dg-grid" >
  153.              <thead>
  154.               <tr>
  155.        <tr bgcolor=#DFEBFF id=t70 onclick='coloreaf(70,1)' onMouseOver='coloreamosin(70,1)' onMouseOut='coloreamosout(70,1)'>
  156.                     <th><span title="nu_usuario">Nº Usuario</span></th>
  157.                     <th><span title="telefono">Teléfono</span></th>
  158.                     <th><span title="nombre">Nombre</span></th>
  159.                     <th><span title="poblacion">Población</span></th>  
  160.                      </tr>
  161.                 </thead>
  162.                 <tbody>
  163.                 </tbody>
  164.             </table>
  165.                 </div>
  166.           </div>
  167.           <div class="TabbedPanelsContent">
  168.            <div id="aparato">
  169.           <table width="100%" id="data1">
  170.            <thead>
  171.   <tr>
  172.    <tr bgcolor=#DFEBFF id=t70 onclick='coloreaf(70,1)' onMouseOver='coloreamosin(70,1)' onMouseOut='coloreamosout(70,1)'>
  173.                     <th><span title="aparato">Aparato</span></th>
  174.                     <th><span title="marca">Marca</span></th>
  175.                     <th><span title="modelo">Modelo</span></th>
  176.                     <th><span title="NUM_SERIE">Nº Serie</span></th>
  177.                     <th><span title="num_PRODUCTO">Cod/12NC</span></th>
  178.                     <th><span title="FECHA_compra">F.Compra</span></th>
  179.    </tr>
  180.                 </thead>
  181.                 <tbody>
  182.                 </tbody>
  183. </table>
  184. </div>
  185. </div>
  186.           <div class="TabbedPanelsContent">
  187.            
  188.           <table cellpadding="0" cellspacing="0" id="data2">
  189.                 <thead>
  190.                   <tr>
  191.                     <th><span title="num_aviso"></span></th>
  192.                     <th><span title="num_usuario"></span></th>
  193.                     <th><span title="aparato"></span></th>
  194.                     <th><span title="calle"></span></th>
  195.                     <th><span title="fecha_recepcion"></span></th>
  196.                     <th><span title="fecha_recepcion"></span></th>
  197.                     <th><span title="sintoma"></span></th>
  198.                   </tr>
  199.                 </thead>
  200.                 <tbody>
  201.                 </tbody>
  202.               </table>            
  203.           </div>
  204. </div>
  205.       </div>
  206.       <table width="100%">
  207.         <tr>
  208. <th scope="col"><a class="" href="javascript:enviar_formulario()"><span></span><img src="imagenes_menu/generar_aviso1.png" width="150" height="40" border="0"/></a>
  209. </th>
  210.           <th scope="col">&nbsp;</th>
  211.           <th scope="col"></th>
  212.           <th scope="col"><a class="" href="javascript:enviar_formulario1()"><span></span><img src="imagenes_menu/boton_salir.png" width="150" height="40" border="0"/></a>
  213.  </th>
  214.         </tr>
  215.       </table>
  216.     </div>
  217. </div>
  218. </div>
  219. <script type="text/javascript">
  220. var TabbedPanels1 = new Spry.Widget.TabbedPanels("TabbedPanels1");
  221. </script>
  222. </body>
  223. </html>
  224. <?php
  225. mysql_free_result($Recordset1);
  226. ?>

Última edición por satjaen; 28/09/2012 a las 11:49
  #9 (permalink)  
Antiguo 28/09/2012, 16:06
Avatar de Dradi7  
Fecha de Ingreso: junio-2008
Ubicación: Peru - Lima
Mensajes: 1.518
Antigüedad: 11 años, 7 meses
Puntos: 220
Respuesta: Funcion en Paneles

es que tu error esta que estas pasandolo todo como texto

deberia ser asi

"ID=" + num_usuario
__________________
La clave de todo triunfador es eliminar todas sus excusas y sus limitaciones
  #10 (permalink)  
Antiguo 28/09/2012, 17:43
Avatar de satjaen  
Fecha de Ingreso: septiembre-2012
Ubicación: Jaén (Andalucía)
Mensajes: 893
Antigüedad: 7 años, 4 meses
Puntos: 10
Respuesta: Funcion en Paneles

Dradi7, es que me he liado.....no se si la function createAjax tiene que ir en el cod index del formulario o en el cod js, porque la variable num_usuario la tengo en cod js?

Te pongo el

index.php

Código PHP:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<script type="text/javascript" src="assets/js/jquery-1.7.2.min.js"></script>
<script type="text/javascript" src="assets/jqueryui/js/jquery-ui-1.8.16.custom.min.js"></script>
<script type="text/javascript" src="assets/js/js.js"></script>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Documento sin título</title>
<link href="estilo1.css" rel="stylesheet" type="text/css" />
<script src="SpryAssets/SpryTabbedPanels.js" type="text/javascript"></script>
<link href="SpryAssets/SpryTabbedPanels.css" rel="stylesheet" type="text/css" />
<script>
function createAjax(){
   if (window.XMLHttpRequest)
   {
      xmlhttp=new XMLHttpRequest();
   }
   else
   {
      xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
   }
}
 
function buscarAparatos()
{
    createAjax();
    xmlhttp.onreadystatechange=function()
    {
        if (xmlhttp.readyState==4 && xmlhttp.status==200)
        {
            document.getElementById("myDiv").innerHTML=xmlhttp.responseText;
        }
    }
    xmlhttp.open("GET","tabla_bus_avisos.php",true);
    xmlhttp.send("ID=" + num_usuario);
}
</script>
</head>
<body>
<div id="contenedor">
<div id="cabecera">Consulta de intervenciones</div>
<div id="tabla">
    <div id="formulario">
    <form id="frm_filtro" method="post" action="menu1.php" name="form1">
            <table width="685">
  <tr>
    <td width="9%" class="campo_apellidos2">Teléfonos</td>
    <td width="9%"><input name="telefono" type="text" size="9" /></td>
    <td width="9%"><input name="telefono2" type="text" id="telefono2" size="9" /></td>
    <td width="9%"><input name="telefono3" type="text" id="telefono3" size="9" /></td>
    <td width="32%">&nbsp;</td>
    <td width="18%" class="campo_apellidos2">NIF</td>
    <td width="14%"><input name="NIF" type="text" id="NIF" size="9" /></td>
  </tr>
  <tr>
    <td class="campo_apellidos2">Nombre</td>
    <td colspan="4"><input name="nombre_apellidos" type="text" size="30" />
    <td>&nbsp;</td>
    <td>&nbsp;</td>
  </tr>
  <tr>
    <td class="campo_apellidos2">Localidad</td>
    <td colspan="4"><input name="poblacion" type="text" size="30" />
      <span class="campo_apellidos2">C.Postal</span>      <input name="cod_postal" type="text" id="cod_postal" size="5" /></td>
    <td class="campo_apellidos2">Provincia</td>
    <td><input name="provincia" type="text" size="9" /></td>
  </tr>
  <tr>
    <td class="campo_apellidos2">Calle</td>
    <td colspan="4"><input name="calle" type="text" id="calle" size="45" />
      <span class="campo_apellidos2">Nº</span>      <input name="numero" type="text" id="numero" size="5" /></td>
    <td class="campo_apellidos2">Edificio</td>
    <td><input name="edificio" type="text" id="edificio" size="5" /></td>
  </tr>
  <tr>
    <td class="campo_apellidos2">Puerta</td>
    <td colspan="3"><input name="puerta" type="text" id="puerta" size="5" />
      <span class="campo_apellidos2">      Piso</span>
      <input name="piso" type="text" id="piso" size="5" />
      <span class="campo_apellidos2">Letra</span>        <input name="letra" type="text" id="letra" size="5" /></td>
    <td>&nbsp;</td>
    <td><span class="campo_apellidos2">Nº Mante.</span></td>
    <td><input name="mantenimiento" type="text" id="mantenimiento" size="5" /></td>
  </tr>
  </table>
  <table width="100%">
  <tr>
    <th scope="col"><button type="button"  id="btnfiltrar" name="btnfiltrar" style="border:0; margin:0; padding:0;cursor:pointer">
  <img src="imagenes_menu/boton_buscar.png"/>
</button>
</th>
  </tr>
</table>                
          </form>         
  
    </div>
    <div id="paneles">
      <div id="TabbedPanels1" class="TabbedPanels">
        <ul class="TabbedPanelsTabGroup">
          <li class="TabbedPanelsTab" tabindex="0">Usuarios</li>
          <li class="TabbedPanelsTab" tabindex="0" onclick="buscarAparatos();">Aparatos</li>
          <li class="TabbedPanelsTab" tabindex="0">Intervenciones</li>
</ul>
        <div class="TabbedPanelsContentGroup">
          <div class="TabbedPanelsContent">
           <div id="usuario">
            <table width="100%" id="data" class="table-dg-grid" >
             <thead>
              <tr>
       <tr bgcolor=#DFEBFF id=t70 ondblclick='coloreaf(70,1)' onMouseOver='coloreamosin(70,1)' onMouseOut='coloreamosout(70,1)'>
                   <th><span title="selecc">Selecc.</span></th>
                    <th><span title="nu_usuario">Nº Usuario</span></th>
                    <th><span title="telefono">Teléfono</span></th>
                    <th><span title="nombre">Nombre</span></th>
                    <th><span title="poblacion">Población</span></th>  
                     </tr>
                </thead>
                <tbody>
                </tbody>
            </table>
                </div>
          </div>
          <div class="TabbedPanelsContent">
           <div id="aparato">
          <table width="100%" id="data1">
           <thead>
  <tr>
   <tr bgcolor=#DFEBFF id=t70 onclick='coloreaf(70,1)' onMouseOver='coloreamosin(70,1)' onMouseOut='coloreamosout(70,1)'>
                    <th><span title="aparato">Aparato</span></th>
                    <th><span title="marca">Marca</span></th>
                    <th><span title="modelo">Modelo</span></th>
                    <th><span title="NUM_SERIE">Nº Serie</span></th>
                    <th><span title="num_PRODUCTO">Cod/12NC</span></th>
                    <th><span title="FECHA_compra">F.Compra</span></th>
   </tr>
                </thead>
                <tbody>
                </tbody> 
</table>
</div>
</div>
          <div class="TabbedPanelsContent">
           
          <table cellpadding="0" cellspacing="0" id="data2">
                <thead>
                  <tr>
                    <th><span title="num_aviso"></span></th>
                    <th><span title="num_usuario"></span></th>
                    <th><span title="aparato"></span></th>
                    <th><span title="calle"></span></th>
                    <th><span title="fecha_recepcion"></span></th>
                    <th><span title="fecha_recepcion"></span></th>
                    <th><span title="sintoma"></span></th>
                  </tr>
                </thead>
                <tbody>
                </tbody>
              </table>            
          </div>
</div>
      </div>
      <table width="100%">
        <tr>
<th scope="col"><a class="" href="javascript:enviar_formulario()"><span></span><img src="imagenes_menu/generar_aviso1.png" width="150" height="40" border="0"/></a>
</th>
          <th scope="col">&nbsp;</th>
          <th scope="col"></th>
          <th scope="col"><a class="" href="javascript:enviar_formulario1()"><span></span><img src="imagenes_menu/boton_salir.png" width="150" height="40" border="0"/></a>
 </th>
        </tr>
      </table>
    </div>
</div>
</div>
<script type="text/javascript">
var TabbedPanels1 = new Spry.Widget.TabbedPanels("TabbedPanels1");
</script>
</body>
</html>
<?php
mysql_free_result
($Recordset1);
?>
  #11 (permalink)  
Antiguo 28/09/2012, 17:43
Avatar de satjaen  
Fecha de Ingreso: septiembre-2012
Ubicación: Jaén (Andalucía)
Mensajes: 893
Antigüedad: 7 años, 4 meses
Puntos: 10
Respuesta: Funcion en Paneles

y el js

Código Javascript:
Ver original
  1. // JavaScript Document
  2. var ordenar = '';
  3. $(document).ready(function(){
  4.    
  5.     // Llamando a la funcion de busqueda al
  6.     // cargar la pagina
  7.     filtrar()
  8.    
  9.     var dates = $( "#del, #al" ).datepicker({
  10.             yearRange: "-50",
  11.             defaultDate: "+1w",
  12.             changeMonth: true,
  13.             changeYear: true,
  14.             onSelect: function( selectedDate ) {
  15.                 var option = this.id == "del" ? "minDate" : "maxDate",
  16.                     instance = $( this ).data( "datepicker" ),
  17.                     date = $.datepicker.parseDate(
  18.                         instance.settings.dateFormat ||
  19.                         $.datepicker._defaults.dateFormat,
  20.                         selectedDate, instance.settings );
  21.                 dates.not( this ).datepicker( "option", option, date );
  22.             }
  23.     });
  24.    
  25.     // filtrar al darle click al boton
  26.     $("#btnfiltrar").click(function(){ filtrar() });
  27.    
  28.     // boton cancelar
  29.     $("#btncancel").click(function(){
  30.         $(".filtro input").val('')
  31.         $(".filtro select").find("option[value='0']").attr("selected",true)
  32.         filtrar()
  33.     });
  34.    
  35.     // ordenar por
  36.     $("#data th span").click(function(){
  37.         var orden = '';
  38.         if($(this).hasClass("desc"))
  39.         {
  40.             $("#data th span").removeClass("desc").removeClass("asc")
  41.             $(this).addClass("asc");
  42.             ordenar = "&orderby="+$(this).attr("title")+" asc"     
  43.         }else
  44.         {
  45.             $("#data th span").removeClass("desc").removeClass("asc")
  46.             $(this).addClass("desc");
  47.             ordenar = "&orderby="+$(this).attr("title")+" desc"
  48.         }
  49.         filtrar()
  50.     });
  51. });
  52.  
  53. var fila= null;
  54. function pulsar(obj, num_usuario) {
  55.   obj.style.background = 'orange';
  56.   if (fila != null && fila != obj)
  57.     fila.style.background = 'white';
  58.   fila = obj;
  59.  window.location ="menu1.php?id="+num_usuario;
  60. }
  61. function filtrar()
  62. {  
  63.     $.ajax({
  64.         data: $("#frm_filtro").serialize()+ordenar,
  65.         type: "POST",
  66.         dataType: "json",
  67.         url: "ajax.php?action=listar",
  68.             success: function(data){
  69.     var html_user ='' ;
  70.     if(data.length > 0){
  71.         $.each(data, function(i,item){
  72.        
  73.        
  74.          
  75.  html_user += '<tr ondblclick="pulsar(this, ' +  String.fromCharCode(39) + item.num_usuario + String.fromCharCode(39)  + ');" >';
  76.  html_user += '<td >'+<input name="s" type="radio" value=""/>+'</td>';
  77.  html_user += '<td >'+item.num_usuario+'</td>';
  78.  html_user += '<td>'+item.telefono+'</td>';
  79.  html_user += '<td>'+item.nombre+' '+item.apellidos+'</td>';
  80.  html_user += '<td>'+item.poblacion+'</td>';
  81.  html_user += '</tr>';
  82.            
  83.                                  
  84.         });                    
  85.     }
  86.     if(html_user == '') html_user = '<tr><td colspan="4" align="center">No se encontraron registros..</td></tr>';
  87.     $("#data tbody").html(html_user);
  88. }
  89.  
  90.            
  91.       });
  92. }


Gracias de nuevo.
  #12 (permalink)  
Antiguo 28/09/2012, 23:17
Avatar de Dradi7  
Fecha de Ingreso: junio-2008
Ubicación: Peru - Lima
Mensajes: 1.518
Antigüedad: 11 años, 7 meses
Puntos: 220
Respuesta: Funcion en Paneles

Primero todo codigo JavaScript debe de ir en un archivo aparte luego

luego en ese archivo debes capturar el num_usuario y poder usar el ajax

Saludos
__________________
La clave de todo triunfador es eliminar todas sus excusas y sus limitaciones
  #13 (permalink)  
Antiguo 29/09/2012, 04:29
Avatar de satjaen  
Fecha de Ingreso: septiembre-2012
Ubicación: Jaén (Andalucía)
Mensajes: 893
Antigüedad: 7 años, 4 meses
Puntos: 10
Respuesta: Funcion en Paneles

Hola, he separado el index.php del js.js, pero no consigo llamar la funcion desde el panel en la pestaña Aparatos:

<li class="TabbedPanelsTab" tabindex="0" onclick="buscarAparatos();">Aparatos</li>


y el js


Código Javascript:
Ver original
  1. // JavaScript Document
  2. var ordenar = '';
  3. $(document).ready(function(){
  4.    
  5.     // Llamando a la funcion de busqueda al
  6.     // cargar la pagina
  7.     filtrar()
  8.    
  9.     var dates = $( "#del, #al" ).datepicker({
  10.             yearRange: "-50",
  11.             defaultDate: "+1w",
  12.             changeMonth: true,
  13.             changeYear: true,
  14.             onSelect: function( selectedDate ) {
  15.                 var option = this.id == "del" ? "minDate" : "maxDate",
  16.                     instance = $( this ).data( "datepicker" ),
  17.                     date = $.datepicker.parseDate(
  18.                         instance.settings.dateFormat ||
  19.                         $.datepicker._defaults.dateFormat,
  20.                         selectedDate, instance.settings );
  21.                 dates.not( this ).datepicker( "option", option, date );
  22.             }
  23.     });
  24.    
  25.     // filtrar al darle click al boton
  26.     $("#btnfiltrar").click(function(){ filtrar() });
  27.    
  28.     // boton cancelar
  29.     $("#btncancel").click(function(){
  30.         $(".filtro input").val('')
  31.         $(".filtro select").find("option[value='0']").attr("selected",true)
  32.         filtrar()
  33.     });
  34.    
  35.     // ordenar por
  36.     $("#data th span").click(function(){
  37.         var orden = '';
  38.         if($(this).hasClass("desc"))
  39.         {
  40.             $("#data th span").removeClass("desc").removeClass("asc")
  41.             $(this).addClass("asc");
  42.             ordenar = "&orderby="+$(this).attr("title")+" asc"     
  43.         }else
  44.         {
  45.             $("#data th span").removeClass("desc").removeClass("asc")
  46.             $(this).addClass("desc");
  47.             ordenar = "&orderby="+$(this).attr("title")+" desc"
  48.         }
  49.         filtrar()
  50.     });
  51. });
  52.  
  53. var fila= null;
  54. function pulsar(obj, num_usuario) {
  55.   obj.style.background = 'orange';
  56.   if (fila != null && fila != obj)
  57.     fila.style.background = 'white';
  58.   fila = obj;
  59.  window.location ="menu1.php?id="+num_usuario;
  60. }
  61. function filtrar()
  62. {  
  63.     $.ajax({
  64.         data: $("#frm_filtro").serialize()+ordenar,
  65.         type: "POST",
  66.         dataType: "json",
  67.         url: "ajax.php?action=listar",
  68.             success: function(data){
  69.     var html_user ='' ;
  70.     if(data.length > 0){
  71.         $.each(data, function(i,item){
  72.        
  73.        
  74.          
  75.  html_user += '<tr ondblclick="pulsar(this, ' +  String.fromCharCode(39) + item.num_usuario + String.fromCharCode(39)  + ');" >';
  76.  html_user += '<td ><input name="s" type="radio" value=""/></td>';
  77.  html_user += '<td >'+item.num_usuario+'</td>';
  78.  html_user += '<td>'+item.telefono+'</td>';
  79.  html_user += '<td>'+item.nombre+' '+item.apellidos+'</td>';
  80.  html_user += '<td>'+item.poblacion+'</td>';
  81.  html_user += '</tr>';
  82.            
  83.                                  
  84.         });                    
  85.     }
  86.     if(html_user == '') html_user = '<tr><td colspan="4" align="center">No se encontraron registros..</td></tr>';
  87.     $("#data tbody").html(html_user);
  88. }
  89.  
  90.            
  91.       });
  92. }
  93. function createAjax(){
  94.    if (window.XMLHttpRequest)
  95.    {
  96.       xmlhttp=new XMLHttpRequest();
  97.    }
  98.    else
  99.    {
  100.       xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
  101.    }
  102. }
  103.  
  104. function buscarAparatos()
  105. {
  106.     createAjax();
  107.     xmlhttp.onreadystatechange=function()
  108.     {
  109.         if (xmlhttp.readyState==4 && xmlhttp.status==200)
  110.         {
  111.             document.getElementById("myDiv").innerHTML=xmlhttp.responseText;
  112.         }
  113.     }
  114.     xmlhttp.open("GET","tabla_bus_avisos.php",true);
  115.     xmlhttp.send("ID=" + num_usuario);
  116. }


Por favor, ayudaaaaaaa.
  #14 (permalink)  
Antiguo 29/09/2012, 19:40
Avatar de Dradi7  
Fecha de Ingreso: junio-2008
Ubicación: Peru - Lima
Mensajes: 1.518
Antigüedad: 11 años, 7 meses
Puntos: 220
Respuesta: Funcion en Paneles

el problema esta de donde vas a tomar el num_usuario si no se encuentra declarado, ademas la variale num_usuario se repite varias veces porque se va a mostrar en varias filas lo conveniente seria que por cada fila se llama la funcion buscarAparato, en todo caso se mas especifico con lo que estas queriendo hacer
__________________
La clave de todo triunfador es eliminar todas sus excusas y sus limitaciones
  #15 (permalink)  
Antiguo 30/09/2012, 04:46
Avatar de satjaen  
Fecha de Ingreso: septiembre-2012
Ubicación: Jaén (Andalucía)
Mensajes: 893
Antigüedad: 7 años, 4 meses
Puntos: 10
Respuesta: Funcion en Paneles

Buenos dias, el num_usuario lo recojo de la pestaña usuarios.En la pestaña usuarios tengo un formulario donde puedo buscar por nº de teléfono, poblacion etc... y es ahí donde hay un div donde me salen varios usuarios, entonces yo selecciono el que quiera con un:

Ejemplo:
html_user += '<td ><input name="s" type="radio" value="+item.num_usuario+"/></td>';


y despues paso a pulsar la pestaña Aparatos.

<li class="TabbedPanelsTab" tabindex="0" onclick="buscarAparatos();">Aparatos</li>


He cambiado algunas cosas pero no se si están bien?


Código Javascript:
Ver original
  1. function buscarAparatos()
  2. {
  3.     createAjax();
  4.     xmlhttp.onreadystatechange=function()
  5.     {
  6.         if (xmlhttp.readyState==4 && xmlhttp.status==200)
  7.         {
  8.             document.getElementById("pestaña1").innerHTML=xmlhttp.responseText;
  9.         }
  10.     }
  11.     xmlhttp.open("GET","tabla_bus_avisos.php",true);
  12.     xmlhttp.send("ID=" + num_usuario);
  13. }


Código PHP:
Ver original
  1. <li class="TabbedPanelsTab" tabindex="0" onclick="buscarAparatos();">Aparatos</li>

Código PHP:
Ver original
  1. <div class="TabbedPanelsContent" id="pestaña1" >
  2.            <div id="aparato">
  3.           <table width="100%">
  4.            <thead>
  5.   <tr>
  6.    <tr bgcolor=#DFEBFF id=t70 onclick='coloreaf(70,1)' onMouseOver='coloreamosin(70,1)' onMouseOut='coloreamosout(70,1)'>
  7.                    <th><span title="aparato">Aparato</span></th>
  8.                     <th><span title="marca">Marca</span></th>
  9.                     <th><span title="modelo">Modelo</span></th>
  10.                     <th><span title="NUM_SERIE">Nº Serie</span></th>
  11.                     <th><span title="num_PRODUCTO">Cod/12NC</span></th>
  12.                     <th><span title="FECHA_compra">F.Compra</span></th>
  13.    </tr>
  14.                 </thead>
  15.                 <tbody>
  16.                 </tbody>
  17. </table>
  18. </div>
  19. </div>

Como ya he indicado anteriormente.
Si necesitas mas aclaraciones por favor no dudes en decirmelo.Gracias

Última edición por satjaen; 30/09/2012 a las 06:13
  #16 (permalink)  
Antiguo 30/09/2012, 15:06
Avatar de Dradi7  
Fecha de Ingreso: junio-2008
Ubicación: Peru - Lima
Mensajes: 1.518
Antigüedad: 11 años, 7 meses
Puntos: 220
Respuesta: Funcion en Paneles

Entonces lo que entiendo es que por cada fila existe un input radio para seleccionar uno eso es lo que entiendo.

Primero agrega a tu input radio un name en comun como por ejemplo demo

Entonces en tu función buscarAparatos agrega lo siguiente

Código Javascript:
Ver original
  1. function buscarAparatos()
  2. {
  3.     var num_usuario = 0;
  4.     var elements = document.getElementsByName('demo');
  5.    
  6.     for(var x=0;elements[x];x++){
  7.         if(elements[x].checked){
  8.             num_usuario = elements[x].value;
  9.             break;
  10.         }
  11.     }
  12.    
  13.     createAjax();
  14.     xmlhttp.onreadystatechange=function()
  15.     {
  16.         if (xmlhttp.readyState==4 && xmlhttp.status==200)
  17.         {
  18.             document.getElementById("pestaña1").innerHTML=xmlhttp.responseText;
  19.         }
  20.     }
  21.     xmlhttp.open("GET","tabla_bus_avisos.php",true);
  22.     xmlhttp.send("ID=" + num_usuario);
  23. }
__________________
La clave de todo triunfador es eliminar todas sus excusas y sus limitaciones
  #17 (permalink)  
Antiguo 30/09/2012, 16:28
Avatar de satjaen  
Fecha de Ingreso: septiembre-2012
Ubicación: Jaén (Andalucía)
Mensajes: 893
Antigüedad: 7 años, 4 meses
Puntos: 10
Respuesta: Funcion en Paneles

Gracias Dradi7, pero un pregunta para recoger el valor num_usuario en el php lo hago así:

Código PHP:
$num_usuario=$_GET['ID'];
mysql_select_db($database_conexion$conexion);
$query_Recordset1 "SELECT * FROM ap_usuarios where num_usuario like '$num_usuario'";
$Recordset1 mysql_query($query_Recordset1$conexion) or die(mysql_error());
$row_Recordset1 mysql_fetch_assoc($Recordset1);
$totalRows_Recordset1 mysql_num_rows($Recordset1); 
Es que no funciona.
  #18 (permalink)  
Antiguo 30/09/2012, 16:40
Avatar de Dradi7  
Fecha de Ingreso: junio-2008
Ubicación: Peru - Lima
Mensajes: 1.518
Antigüedad: 11 años, 7 meses
Puntos: 220
Respuesta: Funcion en Paneles

es que tienes un error cuando tu uses POST debes pasar las variables a traves de

xmlhttp.send("ID=" + num_usuario);

Si fuera GET debes usar lo siguiente

xmlhttp.open("GET","tabla_bus_avisos.php?ID=" + num_usuario,true);
xmlhttp.send(null);
__________________
La clave de todo triunfador es eliminar todas sus excusas y sus limitaciones
  #19 (permalink)  
Antiguo 30/09/2012, 17:46
Avatar de satjaen  
Fecha de Ingreso: septiembre-2012
Ubicación: Jaén (Andalucía)
Mensajes: 893
Antigüedad: 7 años, 4 meses
Puntos: 10
Respuesta: Funcion en Paneles

Perdona, pero no me sale:
Código Javascript:
Ver original
  1. function filtrar()
  2. {  
  3.     $.ajax({
  4.         data: $("#frm_filtro").serialize()+ordenar,
  5.         type: "POST",
  6.         dataType: "json",
  7.         url: "ajax.php?action=listar",
  8.             success: function(data){
  9.     var html_user ='' ;
  10.     if(data.length > 0){
  11.         $.each(data, function(i,item){
  12.        
  13.        
  14.          
  15.  html_user += '<tr ondblclick="pulsar(this, ' +  String.fromCharCode(39) + item.num_usuario + String.fromCharCode(39)  + ');" >';
  16.  html_user += '<td ><input name="demo" type="radio" value="demo"/></td>';
  17.  html_user += '<td >'+item.num_usuario+'</td>';
  18.  html_user += '<td>'+item.telefono+'</td>';
  19.  html_user += '<td>'+item.nombre+' '+item.apellidos+'</td>';
  20.  html_user += '<td>'+item.poblacion+'</td>';
  21.  html_user += '</tr>';
  22.            
  23.                                  
  24.         });                    
  25.     }
  26.     if(html_user == '') html_user = '<tr><td colspan="4" align="center">No se encontraron registros..</td></tr>';
  27.     $("#data tbody").html(html_user);
  28. }
  29.  
  30.            
  31.       });
  32. }
  33.  
  34. function createAjax(){
  35.    if (window.XMLHttpRequest)
  36.    {
  37.       xmlhttp=new XMLHttpRequest();
  38.    }
  39.    else
  40.    {
  41.       xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
  42.    }
  43. }
  44.  
  45. function buscarAparatos()
  46. {
  47.     var num_usuario = 0;
  48.     var elements = document.getElementsByName('demo');
  49.    
  50.     for(var x=0;elements[x];x++){
  51.         if(elements[x].checked){
  52.             num_usuario = elements[x].value;
  53.             break;
  54.         }
  55.     }
  56.    
  57.     createAjax();
  58.     xmlhttp.onreadystatechange=function()
  59.     {
  60.         if (xmlhttp.readyState==4 && xmlhttp.status==200)
  61.         {
  62.             document.getElementById("pestaña1").innerHTML=xmlhttp.responseText;
  63.         }
  64.     }
  65.    xmlhttp.open("GET","listado_aparatos.php?ID=" + num_usuario,true);
  66.    xmlhttp.send(null);
  67. }


y lo paso por GET:

Código PHP:
$num_usuario=$_GET['id'];
mysql_select_db($database_conexion$conexion);
$query_Recordset1 "SELECT * FROM ap_usuarios where num_usuario like '$num_usuario'";
$Recordset1 mysql_query($query_Recordset1$conexion) or die(mysql_error());
$row_Recordset1 mysql_fetch_assoc($Recordset1);
$totalRows_Recordset1 mysql_num_rows($Recordset1); 

Última edición por satjaen; 30/09/2012 a las 18:21
  #20 (permalink)  
Antiguo 01/10/2012, 05:48
Avatar de satjaen  
Fecha de Ingreso: septiembre-2012
Ubicación: Jaén (Andalucía)
Mensajes: 893
Antigüedad: 7 años, 4 meses
Puntos: 10
Respuesta: Funcion en Paneles

Por favor, puede ayudarme alguien?
Puede ser que tenga esto mal? html_user += '<td ><input name="demo" type="radio" value="demo"/></td>';

Última edición por satjaen; 01/10/2012 a las 11:41
  #21 (permalink)  
Antiguo 02/10/2012, 15:53
 
Fecha de Ingreso: agosto-2006
Mensajes: 125
Antigüedad: 13 años, 5 meses
Puntos: 1
Respuesta: Funcion en Paneles

si entiendo tu problema?

por ejemplo. en el primer panel tiene nombre
en el segundo cualquier cosa1.
en el tercero cualquiercosa2
correcto?

y mientras no llenes el panel 1 no puedes pasar al panel 2? y así sustantivamente.
  #22 (permalink)  
Antiguo 02/10/2012, 16:37
Avatar de satjaen  
Fecha de Ingreso: septiembre-2012
Ubicación: Jaén (Andalucía)
Mensajes: 893
Antigüedad: 7 años, 4 meses
Puntos: 10
Respuesta: Funcion en Paneles

Hola, no te explico:

1º Pestaña Usarios:

- Selecciono con un input radio el usuario que yo quiera una vez que lo he buscado por nº teléfono,localidad etc..

2º Pestaña Aparatos:

- Pulsando en la pestaña Aparatos del usuario elegido me aparecen los aparatos que tienen el usuario
que he pasado con el input radio y la variable num_usuario.

Me explico?
  #23 (permalink)  
Antiguo 03/10/2012, 01:50
Avatar de satjaen  
Fecha de Ingreso: septiembre-2012
Ubicación: Jaén (Andalucía)
Mensajes: 893
Antigüedad: 7 años, 4 meses
Puntos: 10
Respuesta: Funcion en Paneles

Dradi7 estas por ahí?
  #24 (permalink)  
Antiguo 03/10/2012, 01:56
Avatar de Dradi7  
Fecha de Ingreso: junio-2008
Ubicación: Peru - Lima
Mensajes: 1.518
Antigüedad: 11 años, 7 meses
Puntos: 220
Respuesta: Funcion en Paneles

Mira lo que estas haciendo aca

xmlhttp.open("GET","listado_aparatos.php?ID=" + num_usuario,true);

y aca

$num_usuario=$_GET['id'];

debes respetar siempre mayusculas y minisculas entonces esto deberia ser asi

$num_usuario=$_GET['ID'];
__________________
La clave de todo triunfador es eliminar todas sus excusas y sus limitaciones
  #25 (permalink)  
Antiguo 03/10/2012, 02:07
Avatar de satjaen  
Fecha de Ingreso: septiembre-2012
Ubicación: Jaén (Andalucía)
Mensajes: 893
Antigüedad: 7 años, 4 meses
Puntos: 10
Respuesta: Funcion en Paneles

Buenos dias, tampoco funciona con $num_usuario=$_GET['ID']; , ya lo he probado.
Creo que puede ser que este mal el input html_user += '<td ><input name="demo" type="radio" value="demo"/></td>';, que no me esta mandando al php nada.
Puede ser?
  #26 (permalink)  
Antiguo 03/10/2012, 02:28
Avatar de Dradi7  
Fecha de Ingreso: junio-2008
Ubicación: Peru - Lima
Mensajes: 1.518
Antigüedad: 11 años, 7 meses
Puntos: 220
Respuesta: Funcion en Paneles

Bueno supongo que primero estas cargando la funcion fitrar, luego de esto presionas un input radio y luego de esto debes llamar la funcion de buscarAparato

Saludos
__________________
La clave de todo triunfador es eliminar todas sus excusas y sus limitaciones
  #27 (permalink)  
Antiguo 03/10/2012, 02:31
Avatar de satjaen  
Fecha de Ingreso: septiembre-2012
Ubicación: Jaén (Andalucía)
Mensajes: 893
Antigüedad: 7 años, 4 meses
Puntos: 10
Respuesta: Funcion en Paneles

OK, asi lo hago.Y sin embargo con la funcion pulsar si funciona perfectamente:

Código Javascript:
Ver original
  1. var fila= null;
  2. function pulsar(obj, num_usuario) {
  3.   obj.style.background = 'orange';
  4.   if (fila != null && fila != obj)
  5.     fila.style.background = 'white';
  6.   fila = obj;
  7.  window.location ="menu1.php?id="+num_usuario;
  8. }
  9. function filtrar()
  10. {  
  11.     $.ajax({
  12.         data: $("#frm_filtro").serialize()+ordenar,
  13.         type: "POST",
  14.         dataType: "json",
  15.         url: "ajax.php?action=listar",
  16.             success: function(data){
  17.     var html_user ='' ;
  18.     if(data.length > 0){
  19.         $.each(data, function(i,item){
  20.        
  21.        
  22.          
  23.  html_user += '<tr ondblclick="pulsar(this, ' +  String.fromCharCode(39) + item.num_usuario + String.fromCharCode(39)  + ');" >';
  24.  html_user += '<td ><input name="demo" type="radio" value="demo"/></td>';
  25.  html_user += '<td >'+item.num_usuario+'</td>';
  26.  html_user += '<td>'+item.telefono+'</td>';
  27.  html_user += '<td>'+item.nombre+' '+item.apellidos+'</td>';
  28.  html_user += '<td>'+item.poblacion+'</td>';
  29.  html_user += '</tr>';
  30.            
  31.                                  
  32.         });                    
  33.     }
  34.     if(html_user == '') html_user = '<tr><td colspan="4" align="center">No se encontraron registros..</td></tr>';
  35.     $("#data tbody").html(html_user);
  36. }
  37.  
  38.            
  39.       });
  40. }
  41.  
  42. function createAjax(){
  43.    if (window.XMLHttpRequest)
  44.    {
  45.       xmlhttp=new XMLHttpRequest();
  46.    }
  47.    else
  48.    {
  49.       xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
  50.    }
  51. }
  52.  
  53. function buscarAparatos()
  54. {
  55.     var num_usuario = 0;
  56.     var elements = document.getElementsByName('demo');
  57.    
  58.     for(var x=0;elements[x];x++){
  59.         if(elements[x].checked){
  60.             num_usuario = elements[x].value;
  61.             break;
  62.         }
  63.     }
  64.    
  65.     createAjax();
  66.     xmlhttp.onreadystatechange=function()
  67.     {
  68.         if (xmlhttp.readyState==4 && xmlhttp.status==200)
  69.         {
  70.             document.getElementById("pestaña1").innerHTML=xmlhttp.responseText;
  71.         }
  72.     }
  73.    xmlhttp.open("GET","listado_aparatos.php?ID=" + num_usuario,true);
  74.    xmlhttp.send(null);
  75. }
  #28 (permalink)  
Antiguo 03/10/2012, 03:12
Avatar de Dradi7  
Fecha de Ingreso: junio-2008
Ubicación: Peru - Lima
Mensajes: 1.518
Antigüedad: 11 años, 7 meses
Puntos: 220
Respuesta: Funcion en Paneles

tienes asignada correctamente la funcion pulsar
__________________
La clave de todo triunfador es eliminar todas sus excusas y sus limitaciones
  #29 (permalink)  
Antiguo 03/10/2012, 03:34
Avatar de satjaen  
Fecha de Ingreso: septiembre-2012
Ubicación: Jaén (Andalucía)
Mensajes: 893
Antigüedad: 7 años, 4 meses
Puntos: 10
Respuesta: Funcion en Paneles

Dradi7, ya se que funciona bien la funcion pulsar es la funcion buscarAparatos la que no funciona.
  #30 (permalink)  
Antiguo 03/10/2012, 03:39
Avatar de Dradi7  
Fecha de Ingreso: junio-2008
Ubicación: Peru - Lima
Mensajes: 1.518
Antigüedad: 11 años, 7 meses
Puntos: 220
Respuesta: Funcion en Paneles

perdon me equivoce es la funcion buscarAparatos, te puedes fijar si te genera error usando el inspector de google chrome o el firebug de mozilla

Saludos
__________________
La clave de todo triunfador es eliminar todas sus excusas y sus limitaciones

Etiquetas: formulario, funcion, html, input, js, paneles, php
Atención: Estás leyendo un tema que no tiene actividad desde hace más de 6 MESES, te recomendamos abrir un Nuevo tema en lugar de responder al actual.
Respuesta




La zona horaria es GMT -6. Ahora son las 14:23.