Я искал достойный плагин jQuery, который может обрабатывать как даты, так и время. Основной пользовательский интерфейс DatePicker велик, но, к сожалению, мне тоже нужно уделить время.
Я нашел несколько хаков для DatePicker, чтобы работать со временем, но все они кажутся довольно неэлегантными, и Google не приносит ничего хорошего.
Есть ли хороший плагин jQuery для выбора дат и времени в одном элементе управления пользовательского интерфейса с помощью удобного интерфейса?
На сегодняшний день самым красивым и простым вариантом выбора DateTime является http://trentrichardson.com/examples/timepicker/.
Это расширение JQuery UI Datepicker, поэтому он будет поддерживать те же темы, а также работает очень точно так же, аналогичный синтаксис и т.д. Это должно быть упаковано с помощью jQuery UI imo.
@David, спасибо за рекомендацию! @fluid_chelsea, я только что выпустил Any + Time (TM) версии 3.x, который использует jQuery вместо Prototype и имеет улучшенный интерфейс, поэтому я надеюсь, что он теперь отвечает вашим потребностям:
Любые проблемы, пожалуйста, дайте мне знать через ссылку комментариев на моем сайте!
На мой взгляд, даты и время должны обрабатываться как два отдельных поля ввода, чтобы они были наиболее полезными и эффективными для ввода пользователем. Пусть пользователь вводит одну вещь за раз, это хороший принцип, imho.
Я использую ядро UI DatePicker и следующий выбор времени.
Это вдохновляет тот, который использует Календарь Google:
jQuery timePicker:
примеры: http://labs.perifer.se/timedatepicker/
проект на github: https://github.com/perifer/timePicker
Я нашел, что это лучший среди всех альтернатив. Пользователь может быстро вводить, он выглядит чистым, прост и позволяет пользователю вводить конкретные моменты с точностью до минуты.
PS: На мой взгляд: слайдеры (используемые некоторыми альтернативными выборщиками времени) занимают слишком много кликов и требуют от пользователя точности мыши (что делает вход медленнее).
Мой лучший опыт работы с дампикером связан с прототипом AnyTime. Я знаю, что не jQuery, но он все равно может стоить вам компромисса. Я абсолютно не знаю прототипа, и с ним все еще достаточно легко работать.
Одно предостережение, которое я нашел: он не является передовым для некоторых браузеров. То есть, он не работал с более новой версией прототипа в Chrome.
Чтобы добавить к информации здесь, The Fluid Project имеет приятный вики-реестр, в котором рассматривается большое количество дат и/или выборщиков времени здесь.
Я исследовал это совсем недавно и еще не нашел достойного выбора даты, который также включает приличный выбор времени. В результате я использовал eyecon awesome DatePicker с двумя простыми выпадающими списками для времени. У меня возникло соблазн использовать Timepickr.js, хотя он выглядит как действительно хороший подход.
Я столкнулся с той же проблемой. Я на самом деле разработал мое использование серверной части программирования, но я сделал быстрый поиск, чтобы попытаться помочь вам и нашел это.
Кажется хорошо, не слишком много смотрел на источник, но, кажется, был чисто JavaScript.
Посмотрите:
http://www.rainforestnet.com/datetimepicker/datetimepicker.htm
Вот ссылка на демонстрационную страницу:
http://www.rainforestnet.com/datetimepicker/datetimepicker-demo.htm
удача
Не jQuery, но он хорошо работает для календаря со временем: JavaScript Date Time Picker.
Я просто связал событие click, чтобы его всплыть:
$(".arrival-date").click(function() {
NewCssCal($(this).attr('id'), 'mmddyyyy', 'dropdown', true, 12);
});
Это код, который я использую, чтобы выбрать пользователя datetimepicker, установите дату и время и другой datetimepicker добавляет одну минуту к тому времени.
Мне это нужно для пользовательского контроля лекарств....
В любом случае, подумал, что это может помочь кому-то еще, не найти ответ в любом месте онлайн...
(по крайней мере, не полный ответ)
Имейте в виду, что добавлено 60000, добавляет одну минуту. (60 * 1000 миллисекунд)
$('.frdtPicker').datetimepicker({
onClose: function(dateText, inst) {
var endDateTextBox = $('.todtPicker');
if (endDateTextBox.val() != '') {
var testStartDate = new Date(dateText);
var testEndDate = new Date(endDateTextBox.val());
if (testStartDate > testEndDate) {
var testStartDate = new Date(dateText).getTime() + 60000;
var testStartDate2 = new Date(testStartDate);
endDateTextBox.datetimepicker('setDate', (new Date(testStartDate2)));
}
}
else {
var testStartDate = new Date(dateText).getTime() + 60000;
var testStartDate2 = new Date(testStartDate);
endDateTextBox.datetimepicker('setDate', (new Date(testStartDate2)));
}
$('.frdtPicker').val(dateText); //endDateTextBox.val());
},
onSelect: function(selectedDateTime) {
var start = $(this).datetimepicker('getDate');
$('.todtPicker').datetimepicker('option', 'minDate', new Date(start.getTime()));
}
});
Взгляните на следующий плагин JavaScript.
Календарь Javascript с датой и временем
Я сделал это максимально простым. но он все еще в первые дни. Дайте мне знать обратную связь, чтобы я мог ее улучшить.
Я делаю одну функцию следующим образом:
function getTime()
{
var date_obj = new Date();
var date_obj_hours = date_obj.getHours();
var date_obj_mins = date_obj.getMinutes();
var date_obj_second = date_obj.getSeconds();
var date_obj_time = "'"+date_obj_hours+":"+date_obj_mins+":"+date_obj_second+"'";
return date_obj_time;
}
Затем я использую jQuery UI datepicker следующим образом:
$("#selector").datepicker( "option", "dateFormat", "yy-mm-dd "+getTime()+"" );
Итак, я получаю следующее значение: 2010-10-31 12:41:57
Нам не удалось найти тот, который работал так, как мы этого хотели, поэтому я написал его. Я поддерживаю источник и исправляю ошибки по мере их возникновения, а также предоставляю бесплатную поддержку.
http://www.yart.com.au/Resources/Programming/ASP-NET-JQuery-Date-Time-Control.aspx