Organizar pantallas de muchos datos mediante Tabs (css y jquery)

Trabajando en el sitio web de IndustriasArgentinas.com, un cliente que me solicitó presupuesto y contrató para desarrollar sus proyectos webs, nos surgió la necesidad de dividir los datos en TABS puesto que eran muchos datos y de lo contrario la pantalla se hacía muy larga.

Encontré un script html, css y jquery para hacerlo, es muy bueno y sencillo de implementar. Pueden encontrar la demo aquí:

http://industriasargentinas.com/RondasNegocios/pruebatab/

Algo muy piola del script es que no refresca la pantalla completa al cambiar de pestaña, super útil desde el punto de vista de usabilidad.

Otra característica clave que me sorprendió del script es su flexibilidad con los formularios. Por ejemplo, supongamos que tenemos un campo de texto en cada pestaña. Ingresamos un valor en el campo de la pestaña 1. Al pasar a la pestaña2, te recuerda el valor ingresado en la pestaña 1 y sin necesidad de hacer el submit.

Es decir, podemos editar los valores de los campos de todas la pestañas y mandar el submit al final. No es necesario hacer submit antes de pasar a una nueva pestaña del TAB.

Aprovecho en dar mis créditos al autor del script html, css y jquery para configurar una pantalla con TABs. Allí podrán encontrar detalladas instrucciones sobre su funcionamiento.

También comparto los archivos del script xq no los encontré en la web del autor: https://www.blogdephp.com/scripttab.zip

You may also like...

Deja un comentario

Tu dirección de correo electrónico no será publicada. Los campos obligatorios están marcados con *