Хочу поделиться моим Dojo-модулем для выбора времени. Этот контролл понадобился мне во время исследований в нашем институте. Задачей контрола было предоставить студентам понятный и быстрый интерфейс для выбора времени.





Сначала было желание мимолетно упростить себе жизнь и сделать HTML хард-код в виде двух выпадающих списков с выбором часа и минут, потом подумал почему бы не сделать это в виде Dojo компонента, что даст мне некоторые преимущества:
1. Возможность сделать более красивый и удобный интерфейс
2. Более удобное использование такого компонента для установки/получения текущего времени
3. Возможность легко создавать новые экземпляры компонента с помощью JavaScript, а также полное управление этим компонентом
4. Неплохая экономия трафика
И так приступим. Что должен делать мой компонент:
1. Принимать время в форматах: H:M, количество минут (например 125=2:05)
2. При выборе времени заносить его в скрытое поле для возможности получения времени при отправке формы на сервер
3. Иметь JavaScript — функции для установки/получения текущего времени компонента

Рассмотрим весь процесс разработки.

1. Dojo установлен и настроен. Для начала убедитесь, что Dojo установлен и настроен правильно. В этой статье я не буду рассматривать процесс установки и настройки, так как этот процесс довольно таки хорошо документирован. Предположим что Dojo установлен в папку /js/dojo/dojo.
2. Настройка Dojo для работы с нашими компонентами. Свои компоненты мы желаем размещать в отдельных директориях, которые не будут конфликтовать с Dojo, для собственных Dojo-компонентов создадим папку /js/dojo/switlle
Теперь для использования наших компонентов из этой папки мы должны зарегистрировать этот путь. Сделайте это сразу после подключения Dojo:

3. Создание Dojo модуля TimeSelect. Теперь создадим файл /js/dojo/switlle/TimeSelect.js с таким содержимым: