Javascript-форум (https://javascript.ru/forum/)
-   Общие вопросы Javascript (https://javascript.ru/forum/misc/)
-   -   Диалог элемента управления своими руками (https://javascript.ru/forum/misc/50999-dialog-ehlementa-upravleniya-svoimi-rukami.html)

Roman Koff 20.10.2014 16:04

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

Т.е. банально datepicker. Как построить функционал с использованием JQuery?

MallSerg 20.10.2014 18:45

<input type="date">

Erolast 20.10.2014 19:16

Цитата:

Сообщение от MallSerg (Сообщение 336630)
<input type="date">

Только в опере и хроме реализовано.

Цитата:

Сообщение от Roman Koff (Сообщение 336596)
Имеется текстовое поле ввода. Нужно чтобы при клике на нем показывалось поле с формой, где устанавливаются некие значения и после клика на сохранить, эти значения передавались текстовому полю.

Т.е. банально datepicker. Как построить функционал с использованием JQuery?

https://www.google.com/search?q=jquery+datepicker

Roman Koff 20.10.2014 20:33

Нет. Про готовые датапикеры я знаю и юзаю:
- https://github.com/smalot/bootstrap-datetimepicker -- основная рабочая лошадка
- https://github.com/nazar-pc/PickMeUp -- тоже очень неплохой вариант
- https://github.com/xdan/datetimepicker -- до кучи
- http://javascript.ru/forum/project/2...iznu-koda.html

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

Roman Koff 20.10.2014 20:35

Вопрос то прост. Есть контрол на форме, при клике рисуем формочку, забираем текущее значение контрола на форму, на форме простенькая логика, при сохранении/закрытии формы передаем значение контролу.

danik.js 20.10.2014 21:18

Цитата:

Сообщение от Roman Koff
хочу сделать сам

Ну ты гемор себе ищешь. Или хочешь поучиться?
Цитата:

Сообщение от Erolast
Только в опере и хроме реализовано.

Эта штука (webshims) решает данную проблему: http://jsfiddle.net/trixta/VNuct/
Кроме того, имеет простой дизайн - раскрасить под свой проект не составит труда. Правда там все размеры в em :blink:

Roman Koff 20.10.2014 21:42

Датапикер вообще не цель! Мне не нужен датапикер, мне нужен пример простого функционала: клик на контрол -> дорисовали форму -> клик на форме -> скрыли форму + установили значение контрола.

danik.js 20.10.2014 21:52

Самый простой вариант - вычисляешь позицию инпута, позиционируешь по этой позиции свой попап. Попап делаешь position:fixed. Правда скролл будет проблемой.
И еще: я считаю что фокус не нужно убирать с инпута. То есть в попапе будет виртуальный фокус. Если не делаешь сайт для слепых, то это не будет проблемой. Иначе атрибут aria-activedescedant или что-то такое в помощь. Это упростит появление/скрытие попапа. По фокусу - показываем, по блюру - скрываем. Хотя могут возникнуть проблемы.


Часовой пояс GMT +3, время: 01:10.