Calendario en JavaScript (2)

<!-- script que define y configura el calendario-->
<script type="text/javascript">
Calendar.setup({
inputField : "campo_fecha", // id del campo de texto
ifFormat : "%d/%m/%Y", // formato de la fecha que se escriba en el campo de texto
button : "lanzador" // el id del botón que lanzará el calendario
});
</script>

</body>
</html>

El código anterior está comentado para que se entienda más fácilmente. Tiene varias partes.

• En la cabecera se incluyen varios ficheros con las funciones y estilos del calendario. Estos ficheros se encuentran en los archivos de descarga del calendario. Existen varios estilos que se pueden utilizar para ajustar el aspecto del calendario al diseño de la página. También se debe incluir el lenguaje en el que presentar el calendario, en este caso español, que está también incluido en el paquete de descarga.
• Ya en el cuerpo de la página, se muestra el formulario. Es muy simple, pues sólo tiene un campo de texto y un botón para mostrar el calendario.
• En el script de javascript, también dentro del cuerpo de la página, se utiliza la función Calendar.setup, que sirve para cargar el calendario y configurarlo con los valores que deseemos. Todas las opciones de configuración tienen valores por defecto, aunque siempre vamos a tener que definir, como mínimo, los datos que ponemos en este ejemplo. El dato "inputField" sirve para indicar el identificador (atributo id) del campo input donde se tiene que escribir la fecha. El valor "ifFormat" sirve para ajustar el formato de la fecha que se desea escribir en el campo de texto. Por último, el valor "button" debe contener el identificador del botón que lanzará el calendario al pulsarlo.

Ha sido un ejemplo lo más simplificado posible. En la documentación podremos encontrar más ejemplos del calendario y una explicación detallada de su utilización.

Más información en la página del producto: http://www.dynarch.com/projects/calendar/

DHTML Calentar es un proyecto alojado en SourceForge.net, con la siguiente página de proyecto: http://sourceforge.net/projects/jscalendar

Usuarios que han visto este tema también han visto...

- Euroconversor en Javascript
- Cómo pasar variables entre páginas con javascript
- Listas Dependientes en JavaScript
- Polígonos con líneas geodésicas en mapas de Google
- Crear iframes dinámicamente mediante Javascript

- Versión imprimible de este documento

- Enviar por e-mail este documento