Timepicker to 24H format

Webix JS
#1

Hi!
How define calendar time format n the 24-hour?
calendarTime:"%H:%i" - not work (

#2

Can you provide a snippet? As far as I can see, it works:

http://webix.com/snippet/69682ae0

#3

No, not work(
http://webix.com/snippet/57044678

#4

For datepicker you need to use format property:

http://webix.com/snippet/26f24072

#5

Возможно, я чего-то не понимаю… Но в таблице, которая выскакивает при нажатии на кнопку цифры не в 24 часовом формате…
https://yadi.sk/i/EeDPPOiXsEaNX

#6

В отличии от другого виджета https://yadi.sk/i/EeDPPOiXsEaNX

#7

В первую очередь, есть более простой способ - можно задать русскую локаль, и отображение времени изменится нужным образом:

http://webix.com/snippet/3d1597ee

Также можно изменить конфигурацию внутреннего календаря:

view:"datepicker", 
format:"%H:%i",
suggest:{
   type:"calendar", 
   body:{
      type:"time",
      calendarTime:"%H:%i"
}}

http://webix.com/snippet/4ee6e0d6

#8

Супер!!!
Спасибо большое! Ваш фреймворк самый лучший! )))

#9

Варинат с локалью у меня почему-то не работает (((

#10

Локаль работает только в таком случае:

webix.i18n.locales[“ru-RU”]={
groupDelimiter:" “,
groupSize:3,
decimalDelimeter:”.",
decimalSize:2,

			//dateFormat:"%m/%d/%Y",
			dateFormat:"%d.%m.%Y",
			timeFormat:"%H:%i %A",
			longDateFormat:"%d %F %Y",
			fullDateFormat:"%d.%m.%Y %H:%i %A",

			price:"{obj}руб.",
			calendar: {
				monthFull:["Январь", "Февраль", "Март", "Апрель", "Май", "Июнь", "Июль", "Август", "Сентябрь", "Октябрь", "Ноябрь", "Декабрь"],
				monthShort:["Янв", "Фев", "Мар", "Апр", "Май", "Июн", "Июл", "Авг", "Сен", "Окт", "Ноя", "Дек"],
				dayFull:["Воскресение", "Понедельник", "Вторник", "Среда", "Четверг", "Пятница", "Суббота"],
				dayShort:["Вс", "Пн", "Вт", "Ср", "Чт", "Пт", "Сб"]
			}
		};
#11

Проверьте, пожалуйста, подключился ли к странице js-файл с локалью. Используйсте адрес http://cdn.webix.com/site/i18n/ru.js

https://jsfiddle.net/Wolfsbane/8z66909f/

#12

Спасибо!
После подключения этого файла все заработало!

#13

Is there as way to set the time more precise then every 5 minutes. i need to know the precise minute value.

#14

Time step can be controlled by the minuteStep property of the calendar component. And you will need to adjust CSS and dimensions, as the default settings do not presuppose such precise time handling.

Check the following snippet, please: https://webix.com/snippet/1c7194cd

#15

The above snippet does not work using the minuteStep:1 on any of the examples shown. Maybe it worked in 2017 but it does not now. Is there another way of showing all of the seconds?

#16

Hi @daverch

Unfortunately, the minuteStep now supports the limited number of values.
This was made intentionally, as the calendar was not designed to fit more than 12 time slots.

As an alternate solution, I would suggest setting time and date separately, then conjoin selected values, if needed.
In this case, you’ll be able to create UI of any complexity.
Here’s the most simple example of a custom time selector, where time can be set in several form controls (counter, slider, or richselect): Code Snippet
For more details on possible options, please check the related article in our blog.

Also, there is a known use-case of a custom time selector: Code Snippet
This snippet is based on examples mentioned in the above article (but several components were combined in one view).