Почему не работает datepicker

Не работает DatePicker

Добрый день! Во вложении простейший проект Visual Studio 2012 с типом MVC4 по шаблону Internet Application. Я добавил в него model с полем типа дата и view на базе этой модели. Кто мне может объяснить почему не работает datepicker? Мне кажется, я перечитал уже все топики в интернете на данную тему, что только не пробовал, но все равно не работает. Вроде все просто должно быть..

Получилось только с помощью вью-Темплейта даты. Но и то работало почему-то только при запуске из Visual Studio. При публикации на веб-сервер datepicker переставал работать.

Вот ссылка на проект:
https://www.dropbox.com/s/vanw. ation1.zip (11,5Мб)
Посмотрите, пожалуйста.
Спасибо заранее.

Помощь в написании контрольных, курсовых и дипломных работ здесь.

JQuery DatePicker не работает на дочерней странице
Подскажите, пожалуйста, как заставить работать скрипт jQuery DatePicker на Web-странице, которая.

Не работает DatePicker
На сайте http://pp.myrussiaonline.com/ есть форма вверху сайта сразу под слайдером. Инпут должен.

Не работает плагин Datepicker
Здравствуйте! Возникли проблемы с datepicker. Ниже привожу код: Date.

Спасибо за ответ.

Конкретно работает так: при загрузке вьюхи там стоит дата по умолчанию, при установке курсора в это поле не появляется календарик, т.е. поведение как обычного textbox.

Переписал код вьюхи, как вы сказали + добавил два алерта. Первый срабатывает, второй — нет:

Календарик по-прежнему не отображается. А у Вас Ваш вариант заработал? Может, я не правильно подключаю JQuery? Хотя я уже перепробовал во все места вставлять подключение JQuery и с помощью @Scripts.Render и с помощью .

Я попробовал подключить библиотеки, как Вы пишете. По-прежнему не работает.
Я все подключал: и jQueryUI, и стили datepicker, и абслолютно все скрипты и стили JQuery, и по отдельности, и вместе, и google hosted библиотеки, и сам внедрял, и через NuGet. Я серьезно говорю, что испробовал все, что пишут на stackoverflow и вообще все, что ищется через гугл. Потратил в совокупности часов 30-40.. Я подавлен и истощен..

Поэтому примеров как подключить библиотеки я уже видел много. Но все равно не работает. Вы же уже скачали мой проект? Попробуйте, пожалуйста, добиться, чтоб он заработал.

Ведь отдельно я все делаю как в инструкциях и форумах правильно (благо их достаточно), а вместе не работает. Мне бы очень помогло целостное решение, я бы его сам разобрал и рассмотрел. Спасибо.

Добавлено через 6 минут

Вы имеете в виду .sln? Странно, только что скачал архив по ссылке — внутри архива есть .sln.

Источник

Форум

Справочник

Страница 1 из 2

1

2

>

Опции темы

Искать в теме

всем привет.
у меня следующая проблема —

поясню на всякий — при клике на кнопку я копирую поля формы (есть поля уже готовые, но если надо больше нажимаем кнопку и добавляем).

одно из полей формы имеет . Так вот при добавлении полей datepicker не срабатывает в добавленных полях.

подскажите плиз почему это происходит?

я так понимаю, что к классу datepicker у вас привязано какое-то событие?

Это событие не срабатывает потому что при назначении обработчиков данного элемента не существует и при добавлении его вам надо переназначить обработчики.

мм
я пробовал так

нет?
или подскажите подробнее как переназначить обработчик?

и забыл сказать что к datapicker привязано событие выбора даты jQuery

когда вы пишете:

При загрузке страницы и инициализации скриптов скрипт проходит по странице и говорит что все «блаблабла» при клике должны сделать «функция». Так назначаются обработчики.

Чтобы назначить обработчик на новый datepicker вам необходимо:

или, что то же самое:

Работая с объектами jQuery вам надо знать, что эти объекты всегда возвращают объект с которым вы работаете (за исключением тех случаев когда их вывод должен быть задан явно. Т.е. toggleClass() вернет объект к которому он применен, а text() вернет текст)

Обратите внимание, что при назначении обработчика в скобках можно написать название функции, чтобы не повторять уже написанный код.

Очень важно что вам надо переназначить не все обработчики, а только тот элемент которого вы добавили, в противном случае ранее существовавшие datepicker будут выполнять свои действия дважды, трижды . в зависимости от количества переназначений.

Источник

Air Datepicker, легкий и красивый выбор даты

Хочу поделиться с вами опытом написания компонента выбора даты для текстового поля.

Результат работы можно посмотреть здесь: Air Datepicker.

Введение

Работая над последним проектом, возникла необходимость добавить в приложение календарь с возможностью выбрать конкретный месяц. Все популярные плагины такую возможность предоставляют, мой выбор остановился на Zebra Datepicker — маленький, функциональный, все здорово. Но некоторых вещей все же не хватало:

1. передача объектов Date() в параметры вместо строк
2. менее громоздкая разметка
3. гибкое позиционирование элемента
4. анимация при появлении

Сколько не приходилось работать с датой, почти всегда в исходных данных она хранилась в unix формате, и для меня остается загадкой, почему во многих плагинах при задании, к примеру, минимально возможной даты, нужно передавать строку: нужно получить дату, затем переделать ее в строку и уже потом передать плагину, вместо того, чтобы просто отдать new Date(time).

Что касается громоздкой разметки, то к ней добавляется еще и табличная верстка, к ячейкам которой без лишних проблем не добавить position: relative;.

Ну и напоследок все же хочется, чтобы была возможность добавить небольшую анимацию, а из-за того, что многие популярные календари используют метод .show(), который задействует свойство display, плавные переходы (transition) добавлять трудоемко.

Разработка

Календарь я разделил на три части:

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

В этой задаче мне помогли getter’ы и setter’ы. Например, при изменении месяца просто присваивается новая отображаемая дата с измененным номером месяца, и внутри геттера вызывается метод перерисовки тела и навигации календаря. Несмотря на то, что можно было бы обойтись и без них, мне данный подход представляется более красивым. К примеру, вот так выглядит метод перехода к следующему месяцу, году или декаде, в зависимости от текущего вида:

В свою очередь внутри геттера происходит вызов отрисовки элементов календаря (упрощенно):

Точно так же происходит переход на другой вид, очень просто:

Формирование разметки

Основа для календаря выглядит следующим образом:

Без таблиц и намека на них. Ячейка является простым

, что дает возможность добавлять псевдо элементы к ним и позиционировать контент внутри них как захочется.

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

Вычисление общего количества дней в месяце

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

Формирование названий дней

Когда инициализируешь календарь, можно задавать день, с которого начинается неделя. Мне показалось интересным показать как можно сформировать разметку с названиями дней с помощью рекурсии:

Использование flexbox

Для позиционирования внутри календаря я использую flexbox. Он с легкостью позволяет отцентрировать контент внутри ячеек, будет по центру во всех браузерах (которые поддерживают эту технологию) и на разных ОС, в отличие от техники задания высоты и такого же междустрочного интервала.

Плюс он позволяет располагать элементы на равноудаленном расстоянии друг от друга всего одной строчкой:

Не нужно беспокоиться о разных значениях ширины, все будет рассчитываться автоматически.

Можно также упомянуть про кнопки «Сегодня» и «Очистить»:

Если их две, они занимают по 50% ото всей ширины, если одна, то она занимает всю ширину. Этого также можно достичь одной строкой:

Это означает, что элемент в случае необходимости может как увеличиваться в размерах, так и уменьшаться, но при этом размеры всех соседей будут одинаковые. Когда кнопка одна, она расширяется на всю ширину, когда две, они пропорционально уменьшаются и занимают по 50%, и т.д. Можно добавлять сколько угодно элементов, у всех них будут одинаковые размеры, и в сумме они будут занимать всю ширину родителя.

В итоге мы получаем легкость позиционирования контента как при использовании таблиц, но сохраняем при этом чистоту и валидность разметки.

Позиционирование

Позиция элемента задается двумя значениям:

1. сторона, с которой будет появляться календарь
2. положение на этой стороне

Если нужно расположить календарь сверху справа, то значение будет выглядеть как:

Для того, чтобы добавить анимацию «подъезжания» к текстовому полю, я добавил вспомогательные классы, которые говорят с какой стороны нужно начинать анимацию. В данном случае этот класс выглядел бы как .-from-top-. За анимацию отвечают css transition и css transform. Это позволяет достичь плавности, а также добавлять кастомные переходы.

Что касается Date()

Как я упоминал вначале, мне не совсем понятны ситуации, когда вместо объекта даты нужно передавать строку. Возможно это удобно при автоматической инициализации, когда параметры нужно передавать через data атрибуты, но для меня все же удобнее просто передать new Date(). Тем более, что запись вида new Date(2015, 11, 17) не особо сложнее ‘2015-12-17’. Поэтому у меня во всех параметрах, где задается дата, необходимо передавать new Date().

Несколько слов об использовании

Мне нравится практика автоматической инициализации плагинов, поэтому для инициализации календаря к текстовому полю достаточно добавить класс ‘datepicker-here’ и все заработает.

Опции можно передать через data атрибуты.

Кастомизируемое содержимое ячейки

В Air Datepicker есть возможность полностью изменять содержимое ячеек. Это позволяет добавлять, например, названия событий или какой-то вспомогательный контент в ячейки. Для этого нужно использовать опцию onRenderCell():

Заключение

В итоге я могу сказать, что получил неплохой опыт, улучшил свои навыки работы с датой и написания документации. Календарь получился небольшим: всего 20kb (минифицированный js файл), но достаточно функциональным, по крайней мере для меня он свои задачи выполняет. Буду рад, если он или эта статья кому-нибудь поможет.

Источник

Сегодня кнопка в jQuery Datepicker не работает

Я использую jQueryUI Datepicker и показываю кнопку «Сегодня». Но это не сработает. Он также не работает в демо: http://www.jqueryui.com/demos/datepicker/#buttonbar

Я хочу заполнить ввод сегодня, когда нажимаем эту кнопку.

Можно ли заставить его работать?

ОТВЕТЫ

Ответ 1

Их код на самом деле не сломан. Это просто не делает то, что ожидали бы от большинства людей. Который должен ввести сегодня дату в поле ввода. То, что он делает, является ключевым моментом для того, чтобы пользователь мог видеть сегодняшнюю дату в календаре. Если они отключились через месяц или другой год, календарь возвращается к сегодняшнему просмотру без отмены выбора даты, которую пользователь уже выбрал.

Чтобы сделать его более интуитивно понятным, вам необходимо обновить код плагина в соответствии с вашими потребностями. Дайте мне знать, как это происходит.

Вам нужно получить несжатую версию jquery-ui javascript. Я смотрю версию 1.7.2, а функция «_gotoToday» находится в строке 6760. Просто добавьте вызов в этот _gotoToday, который отключает функцию _selectDate() в строке 6831.:) Happy Coding.

Ответ 2

Мне не нравится решение изменения исходного кода jQuery, потому что оно устраняет возможность использования CDN. Вместо этого вы можете переназначить функцию _gotoToday, включив этот код, основанный на ответе @meesterjeeves, где-нибудь в вашем файле области JavaScript:

Приведенный выше код по сути такой же, как jQuery UI Datepicker из версии 1.10.1, за исключением двух строк, отмеченных выше. Весь gotoCurrent с gotoCurrent может быть фактически удален, так как этот параметр не имеет смысла с нашим новым значением «сегодня».

Ответ 3

Я думаю, что лучший способ справиться с этим — переопределить метод _goToToday вне самой библиотеки. Это решило проблему для меня:

Простой и не требует взлома любых событий или изменения каких-либо базовых функций

Ответ 4

Просто добавьте следующие две строки кода в функцию _gotoToday.

Ответ 5

Хотя я знаю, что это уже принято, вот мое расширенное решение, основанное на Идея Сами Зина. Это использовало jQuery 1.6.3 и jQuery UI 1.8.16 и работал у меня в Firefox 6.

Вы также можете также blur() $associatedInput и сосредоточиться на следующем вводе/выборе на своей странице, но это не так, чтобы делать это в общем случае или специфично для реализации.

В качестве примера я сделал это на странице, на которой я работал над используемыми таблицами для макета (не заставляйте меня начинать, я знаю, что это плохая практика!):

Ответ 6

Мне не нравится идея добавления дополнительного кода в исходный код jQuery. И я не хочу переопределять метод _gotoToday , копируя его реализацию где-то в коде javascript и добавляя дополнительные строки внизу.

Итак, я изменил его с помощью этого кода:

Ответ 7

Вы должны использовать опцию todayBtn :

(вместо todayBtn: true ).

Boolean, «связанный». По умолчанию: false

Если true или «связанный», отображает кнопку «Сегодня» в нижней части средства выбора даты, чтобы выбрать текущую дату. Если true, кнопка «Сегодня» будет только перемещать текущую дату в поле зрения; если «связанный», текущая дата также будет выбрана.

Ответ 8

В документации говорится, что кнопка «сегодня», название которой может быть изменено с помощью

изменяется только текущий месяц. Это поведение также можно настроить

После этого нажатие кнопки изменит отображаемый месяц на выбранную дату.

Кажется, что дата с этой кнопкой невозможна по дизайну.

Ответ 9

Я просто избавился от него.

В некоторых файлах CSS эта часть вашей страницы:

Ответ 10

Вы также можете попробовать использовать приведенный ниже код, чтобы заполнить текущую дату в поле ввода при нажатии кнопки «Сегодня». Просто поставьте код ниже в функции _gotoToday (в конце функции) в jquery.ui.datepicker.js .

Обратите внимание, что я использую версию 1.8.5 jquery datepicker.

Ответ 11

Я добавил параметр datepicker для этой цели: selectCurrent.

Чтобы сделать то же самое, вам просто нужно добавить следующее в несжатый файл js:

1) К концу функции Datepicker() добавьте:

2) В конце функции _gotoToday добавьте:

Ответ 12

Ответ 13

Ответ 14

Датпикер реорганизуется как минимум в 10 раз более удивительным. Новая версия рассмотрит эту проблему.

Ответ 15

Вы также можете попробовать добавить это в свой script:

(используйте функцию .live, а не .click)

Ответ 16

Это хак, который работал у меня, который использует функцию обратного вызова Datepicker beforeShow, в отличие от метода live().

Ответ 17

Это простой хак

Ответ 18

Я решил это по-другому.

Я нахожу это раздражающим, переходя к дате, поэтому не забывая нажимать на день, даже если он уже выбран (после нажатия на следующий/предыдущий месяц).

Здесь я обновляю поле ввода напрямую, когда мы перемещаемся по месяцам/годам, которое также срабатывает при нажатии кнопки «Сегодня». Мне также нужно, чтобы событие изменения срабатывало всякий раз, когда выбор изменился.

Ответ 19

(Обратите внимание, что это не вопрос. Я стараюсь быть полезным, предоставляя свое решение, поскольку другие решения не работают для меня.)

Я не мог заставить datepicker оставаться скрытым с любыми другими ответами. Календарь закрывается, а затем снова открывается. Следующий код работал у меня, чтобы изменить кнопку «Сегодня», чтобы установить дату в текущий день и закрыть календарь.

jQuery UI — v1.11.4 jQuery JavaScript Library v1.11.1 IE 11.0.28

Я включил свои значения по умолчанию для полноты.

Источник