Замените grails datepicker на jquery-ui datepicker

#grails #datepicker

Вопрос:

Я использую Grails 4. В домене моей книги есть поле даты под названием Дата публикации. Я использую <f:all bean=»книга»/> в режиме редактирования для отображения полей ввода. Плагин «Поля» отображает 3 раскрывающихся списка с указанием дня, месяца и года в html-файле для поля даты в книге.

Не могли бы вы научить меня, как заменить указатель даты Grails на указатель даты пользовательского интерфейса jQuery, пожалуйста?

Спасибо!

Ответ №1:

Если бы старые плагины сообщества все еще работали, вы могли бы поискать в их коде свое решение. Поскольку Grails больше не поддерживает свое сообщество, вы можете попробовать поискать на github более старый плагин. Это было бы вашим самым быстрым решением.

Комментарии:

1. Хорошо, спасибо. Я продолжу искать ответ в Google.

2. Возможно, вы захотите разделить представление на что-то вроде интерфейса nodejs и просто использовать серверную часть api-сервера; это обеспечивает лучшую абстракцию и масштабируемость.

Ответ №2:

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

 /*
* Render an input field that includes a calendar popup.
*/
def dateField = { attrs ->
    if (!attrs.id) {
        out << "'id' is a required attribute."
        return
    }

    def additionalKeys = attrs.keySet() - ['id','name','value','className']
    def passthroughAttrs =""
    additionalKeys.each{key->
        passthroughAttrs  = "${key}='${attrs[key]}' "
    }

    out << "<input type='text' class='calendarField ${attrs.className ?: ''}' id='${attrs.id}' name='${attrs.name ?: attrs.id}' value='${attrs.value ?: ''}' autocomplete='off' "
    out << "onfocus="jQuery(this).datepicker().datepicker('show');" "
    out << "$passthroughAttrs/>"
    out << "<img id='cal_${attrs.id}' class='calendarIcon' alt='Show Calendar' title='Show Calendar' src='${assetPath(src: 'calendar.png')}' "
    out << "onclick="jQuery('#${attrs.id}').focus();"/>"
}
 

Использование-это что-то вроде:

 <ns:dateField id="someUniqueID" name="fieldName" />
 

Комментарии:

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

Ответ №3:

Как заявил Дэниел, вы можете написать свой собственный тег, и это то, что я тоже сделал. Я также хотел бы отметить, что тег ввода html имеет тип даты.

 <input type="date" id="some-id">
 

Это сработало для меня вместо того, чтобы выполнять всю работу по созданию нового тега.
Недостатком (на мой взгляд) ввода html является то, что некоторые функции не имеют полной поддержки браузера (минимум, максимум). По крайней мере, они не работали на меня. Кроме того, если в некоторых местах вы используете пользовательский интерфейс jQuery, а в других-html, данные в запросе post представляются по-разному.
Входной тег даст вам что-то вроде гггг-мм-дд
, в то время как jQuery даст вам что-то вроде мм-дд-гггг.