Saltar al contenido




Listas desplegables dependientes accesibles con Jquery

Aunque con poco de retraso, porque ya mandé hace tiempo este código a la lista de accesibilidad web que sigo habitualmente, me he decidido a publicarlo en Innovacionweb.com con algunos ajustes y más comentarios.

Partiendo del código creado por Remy he desarrollado este script en PHP que junto con Jquery crea dos listas desplegables dependientes.

Básicamente si el javascript esta desactivado muestra un botón que permite recargar la página para que se rellene la segunda lista dependiendo del dato seleccionado en la primera. Para rellenar la segunda lista se usa JSON.

Todo el proceso, que puedes ver funcionando en esta demostración, se basa en 3 archivos:

  1. La librería Jquery.
  2. El formulario con las dos listas dependientes.
  3. El script que devuelve en formato JSON los valores que se ponen en la segunda lista dependiendo del valor seleccionado en la primera.
  4. En el script del formulario esta la función getIndividual() que se encarga de rellenar la lista dependiente al ejecutarse el proceso por primera vez y que también se ejecuta si se pulsa el botón "Carga personas". Este botón solo se muestra si el javascript esta desactivado y permite rellenar la lista dependiente.

    Pruébalo en la demostración con el javascript activado y desactivado, veras la diferencia.

    Otros enlaces de interes

    Primera versión publicada en AccesoWeb.

    Un sistema similar de combos dependientes accesibles con PHP y jQuery.

    Sobre JSON un par de enlaces: wikipedia y json.org.




© innovacionweb.com | Algunos derechos reservados. Licencia Creative commons
Saber y conocer