Mostrar o calendário para a selecção de datas em jsp
Como adicionar um picador de datas (calendário pop up) para a selecção de datas em {[[0]} ?
Estou a desenvolver uma aplicação web. Eu quero um calendário em jsp para que o usuário possa facilmente escolher uma data desse calendário em vez de digitar e validar a data.3 answers
Dependendo da arquitectura da sua aplicação, pode escolher uma das seguintes abordagens:
1) uma aproximação do lado do servidor (escrevendo uma tag JSP 'de' datepicker'), por exemplo, a framework struts2 tem uma tag JSP de 'datepicker': http://code.google.com/p/struts2-jquery/wiki/DatePickerTag
2) uma aproximação do lado do cliente (usando um elemento javascript para mostrar o leitor de dados) Existem muitos widgets JS lá fora e você pode escolher um dependendo da complexidade do conjunto de recursos tu queres. (plugins jquery, Dojo ambos oferecem datepickers)
Poderá querer considerar a arquitectura geral da aplicação ao fazer esta escolha, uma vez que esta escolha terá normalmente impacto em todas as suas páginas web (à medida que descobrir a necessidade de usar mais elementos na sua interface de Utilizador) {[[2]}
Existem tantos picadores de data na web, Apenas google para "picker de data". Mas já que perguntaste... aqui uma boa visão geral para os programadores http://woork.blogspot.com/2009/01/beautiful-datepickers-and-calendars-for.html com imagens e links para que você possa compará-los de relance (é por isso que eu gosto dessa página).
Qual desses picadores de datas a usar depende de:
- os frameworks JavaScript: talvez um desses já seja usado em sua aplicação, que o framework seria um favorito porque a sobrecarga de codificação/integração é menor;
- o olhar-e-sentir: escolha o que você gosta.
No seu JSP, os campos de entrada permanecerão os mesmos, mas ao carregar em / entrar num campo de data, o pop-up irá aparecer.
add in head javascript code
<head>
<script type="text/javascript" lnaguage="javascript">
$(function()
{
$("#datepicker").datepicker(
{
showOn:"both",
buttonImage:"image.jpg",
dateFormat:"yy-mm-dd",
buttonImageOnly:false,
minDate:+0, //you do not want to show previous date.
maxDate:+0 // you do not want to show next day.
});
});
</script>
</head>
<body>
<input type="text" name="calendar" id="datepicker">
</body>