Ver Mensaje Individual
  #1 (permalink)  
Antiguo 06/11/2015, 10:27
jmg1189
 
Fecha de Ingreso: septiembre-2015
Mensajes: 58
Antigüedad: 8 años, 7 meses
Puntos: 2
problema con pestañas o tabs

hola a todos

tengo un inconveniente con esta función:

Código Javascript:
Ver original
  1. $(document).ready(function() {
  2.             $(".contenido_tab").hide(); //Ocultar capas
  3.             $("ul.tabs li:first").addClass("activa").show(); //Activar primera pestaña
  4.             $(".contenido_tab:first").show(); //Mostrar contenido primera pestaña
  5.  
  6.         // Sucesos al hacer click en una pestaña
  7.             $("ul.tabs li").click(function() {
  8.             $("ul.tabs li").removeClass("activa"); //Borrar todas las clases "activa"
  9.             $(this).addClass("activa"); //Añadir clase "activa" a la pestaña seleccionada
  10.             $(".contenido_tab").hide(); //Ocultar todo el contenido de la pestaña
  11.             var activatab = $(this).find("a").attr("href"); //Leer el valor de href para identificar la pestaña activa
  12.             $(activatab).fadeIn(); //Visibilidad con efecto fade del contenido activo
  13.             return false;
  14.             });
  15.         });

ésta función es para unas pestañas que tengo en mi form, y funciona bien, el inconveniente es que si por ejemplo en x pestaña hago un submit en un boton o en cualquier elemento y al recargar la pagina, se me carga de nuevo en la primera pestaña.

de acuerdo a esto, tengo el siguiente codigo para las pestañas:

Código HTML:
Ver original
  1. <div><br><br>
  2.             <label>Requisitos de la NTC ISO 9001-2008</label><br><br>
  3.             <ul class="tabs">
  4.                 <li><a href="#tab1">AGREGAR</a></li>
  5.                 <li><a href="#tab2">MODIFICAR</a></li>
  6.                 <li><a href="#tab3">ELIMINAR</a></li>
  7.                 <li><a href="#tab4">MATRIZ</a></li>
  8.             </ul>
  9.             <div class="contenedor_tab">
  10.                 <div id="tab1" class="contenido_tab" name="agregar"><br><!-- div contenido agregar-->
  11.                     <form method="POST" name="pes1"> <?php include('includes/iso_tab1.php'); ?>  </form>  
  12.                 </div>
  13.                 <div id="tab2" class="contenido_tab" name='modificar'><br><!-- div contenido modificar-->
  14.                     <form method="POST" name="pes2"> <?php include('includes/iso_tab2.php'); ?>  </form>  
  15.                 </div>
  16.                 <div id="tab3" class="contenido_tab">
  17.                 CONTENIDO3
  18.                 </div>
  19.                 <div id="tab4" class="contenido_tab">
  20.                 CONTENIDO4
  21.                 </div>
  22.             </div>
  23.         </div><br><br>
  24.     </div>

pero por ejemplo tengo un input text y en el evento onblur=submit() en la pestaña #2, se actualiza y se carga de nuevo en la primera pestaña. Mi pregunta es, como puedo hacer para que los archivos que llamo en cada div, se ejecuten sobre ese div sin que se actualice toda la pagina, o como hacer para que la funcion recuerde en que pestaña estaba antes de recargarse.

podrían ayudarme por favor, intento averiguar como ejecutar cada pagina sobre ese div sin recargar, pero no he dado con la solución.

Última edición por jmg1189; 06/11/2015 a las 13:38