Diferencia entre revisiones de «JQuery Datepicker»
De Dos Ideas.
(→Ejemplo) |
(→Ejemplo) |
||
| Línea 6: | Línea 6: | ||
<code html4strict> | <code html4strict> | ||
<html> | <html> | ||
| − | <head> | + | <head> |
| − | <meta http-equiv="Content-Type" content="text/html;charset=utf-8"> | + | <meta http-equiv="Content-Type" content="text/html;charset=utf-8"> |
| − | <title>Demo de un Calendario</title> | + | <title>Demo de un Calendario</title> |
| − | <style type="text/css">@import "css/redmond.calendars.picker.css";</style> | + | <style type="text/css">@import "css/redmond.calendars.picker.css";</style> |
| − | <script type="text/javascript" src="js/jquery-1.4.2.js"></script> | + | <script type="text/javascript" src="js/jquery-1.4.2.js"></script> |
| − | <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script> | + | <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script> |
| − | <script type="text/javascript" src="js/jquery.calendars.js"></script> | + | <script type="text/javascript" src="js/jquery.calendars.js"></script> |
| − | <script type="text/javascript" src="js/jquery.calendars.plus.js"></script> | + | <script type="text/javascript" src="js/jquery.calendars.plus.js"></script> |
| − | <script type="text/javascript" src="js/jquery.datepick.js"></script> | + | <script type="text/javascript" src="js/jquery.datepick.js"></script> |
| − | <script type="text/javascript" src="js/jquery.datepick.lang.js"></script> | + | <script type="text/javascript" src="js/jquery.datepick.lang.js"></script> |
| − | <script type="text/javascript" src="js/jquery.calendars.picker.js"></script> | + | <script type="text/javascript" src="js/jquery.calendars.picker.js"></script> |
| − | <script type="text/javascript"> | + | <script type="text/javascript"> |
| − | $(function() { | + | $(function() { |
| − | + | $('#popupDatepicker').calendarsPicker(); | |
| − | }); | + | }); |
| − | </script> | + | </script> |
| − | </head> | + | </head> |
<body> | <body> | ||
<h1>Calendario con jquery</h1> | <h1>Calendario con jquery</h1> | ||
Revisión del 17:09 7 jun 2010
JQuery Datepicker es un plugin para la librería JavaScript JQuery que permite ingresar una fecha en una página Html, haciendo uso de un calendario.
Ejemplo
<html>
<head>
<meta http-equiv="Content-Type" content="text/html;charset=utf-8">
<title>Demo de un Calendario</title>
<style type="text/css">@import "css/redmond.calendars.picker.css";</style>
<script type="text/javascript" src="js/jquery-1.4.2.js"></script>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script>
<script type="text/javascript" src="js/jquery.calendars.js"></script>
<script type="text/javascript" src="js/jquery.calendars.plus.js"></script>
<script type="text/javascript" src="js/jquery.datepick.js"></script>
<script type="text/javascript" src="js/jquery.datepick.lang.js"></script>
<script type="text/javascript" src="js/jquery.calendars.picker.js"></script>
<script type="text/javascript">
$(function() {
$('#popupDatepicker').calendarsPicker();
});
</script>
</head>
<body>
Calendario con jquery
Fecha:<input type="text" id="popupDatepicker">
</body> </html>
En Java, la página del ejemplo anterior podría resolverse con un Servlet: