Всплывающий календарь для выбора даты в JSP - PullRequest
3 голосов
/ 06 марта 2012

Как добавить средство выбора даты (всплывающий календарь) для выбора даты в jsp?

Я занимаюсь разработкой веб-приложения.Мне нужен календарь в jsp, чтобы пользователь мог легко выбрать дату из этого календаря вместо того, чтобы вводить и проверять дату.

Ответы [ 3 ]

4 голосов
/ 06 марта 2012

В зависимости от архитектуры вашего приложения вы можете выбрать один из следующих подходов:

1) подход на стороне сервера (написание тега JSP 'datepicker') Например, структура Struts2 имеет тег JSP datepicker: http://code.google.com/p/struts2-jquery/wiki/DatePickerTag

2) подход на стороне клиента (использование виджета JavaScript для отображения средства выбора даты) Существует множество виджетов JS, и вы можете выбрать один из них в зависимости от сложности требуемого набора функций. (JQuery плагины, Dojo оба предлагают DatePickers)

При выборе этого варианта может потребоваться учитывать общую архитектуру приложения, поскольку этот выбор, как правило, влияет на все ваши веб-страницы (поскольку вы обнаруживаете необходимость использовать больше виджетов в ваших пользовательских интерфейсах)

4 голосов
/ 06 марта 2012

В интернете так много сборщиков дат, просто Google для "Сборщик дат".Но так как вы спросили ... вот хороший обзор для разработчиков http://woork.blogspot.com/2009/01/beautiful-datepickers-and-calendars-for.html со скриншотами и ссылками, чтобы вы могли сравнить их с первого взгляда (вот почему мне нравится эта страница).

Какаявыбор этих средств выбора даты зависит от:

  1. фреймворков JavaScript: может быть, один из них уже используется в вашем приложении, этот фреймворк будет любимым, потому что затраты на кодирование / интеграцию меньше;
  2. внешний вид: выберите тот, который вам нравится.

В вашем JSP поля ввода останутся прежними, но при нажатии / вводе поля даты всплывающее окнопоявится.

0 голосов
/ 08 марта 2014
 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>
...