Grails Date Property Editor

Question

Я использую указатель даты jQuery UI вместо <g:datePicker>, который изменяет выбранную дату в текстовом поле. Теперь я хочу сохранить это аккуратно обратно в мою базу данных, и наткнулся на редакторы пользовательских свойств. нажмите меня, чтобы увидеть тему StackOverflow

Однако, добавление этого пользовательского PropertyEditor ничего не изменило, даты по-прежнему отображаются как «2010-01-01 00: 00: 00.0», и если я пытаюсь сохранить дату, она вылетает с Cannot cast object '05.05.2010' with class 'java.lang.String' to class 'java.util.Date'.

Нужна ли какая-то дополнительная магия, например, специальное наименование текстового поля или что-то подобное?

Answer 1

Вам нужно проверить код GrailsBinder. Однако у меня есть, возможно, более простое решение. Ниже приведен код JQuery, который находит весь код g: datePicker и отображает сборщик данных Grails. Он скрывает исходные поля выбора (поэтому этот код будет корректно ухудшать ), а затем вставляет новое текстовое поле и средство выбора даты JQuery UI. Это решение также работает, когда пользователь изменяет только текстовое поле, не опуская средство выбора даты.

 function updateDatePicker () { 
    $("input[value='date.struct']:hidden").each(function() {
        var dateFormat = "dd/mm/yy";
        var name = $(this).attr('name');            
        var id = name.replace(".", "_").replace("[", "_").replace("]", "_") + "_input"; // Create JQuery Friendly ID

        if ($('#'+id).length == 0) {

            // Find the Select Elements
            var selectDay= $(this).nextAll("select:eq(0)").hide();
            var selectMonth = $(this).nextAll("select:eq(1)").hide();
            var selectYear = $(this).nextAll("select:eq(2)").hide();

            // Get the Values
            var dateDay= $(selectDay).val();
            var dateMonth = $(selectMonth).val();
            var dateYear = $(selectYear).val();

            // Calculate the Current Input Value
            var val = "";           
            if (dateDay != "" && dateYear != "" && dateMonth != "") { // If there is a date in the Selects then use it otherwise it's empty
                var date = new Date (dateYear, dateMonth-1, dateDay);
                val = $.datepicker.formatDate(dateFormat, date);
            }

            // Create element
            var template = "<input type='text' name='"+ id +"' id='"+ id +"' value='"+ val +"'/>";

            if ($(this).parent(".datePickerCalenderView").size()) {
                template = "<div id='"+ id +"'/>";
            }


            $(this).before(template);       
            var displayWidget = $('#' + id );

            displayWidget.blur(function() {         
                var date = $.datepicker.parseDate(dateFormat, $(this).val());

                if (date == null) {
                    $(selectDay).val("");
                    $(selectMonth).val("");
                    $(selectYear).val("");
                }
                else {
                    $(selectDay).val(date.getDate());
                    $(selectMonth).val(date.getMonth()+1);
                    $(selectYear).val(date.getFullYear());
                }
            }).keydown(function(event) {
                // Show popup on Down Arrow
                if (event.keyCode == 40) {
                    displayWidget.datepicker("show");
                }
            });

            displayWidget.datepicker({  
                changeMonth: true,
                changeYear: true,
                dateFormat: dateFormat,
                constrainInput: true,           
                showButtonPanel: true,
                showWeeks: true,
                showOn: 'button',           
                onSelect: function(dateText, inst) { 
                    if (inst == null) {
                        $(selectDay).val("");
                        $(selectMonth).val("");
                        $(selectYear).val("");
                    }
                    else {
                        $(selectDay).val(inst.selectedDay);
                        $(selectMonth).val(inst.selectedMonth+1);
                        $(selectYear).val(inst.selectedYear);
                    }
                }           
            });     
        }
    });   
}

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

$(document).ready (function (){ 
    updateDatePicker();

    $("#spinner").ajaxComplete (function(event, request, settings){   
        updateDatePicker();
    });
});

Надеюсь, это поможет.

Answer 2

Не должно быть столько магии.

resources.groovy

beans = {
    customPropertyEditorRegistrar(CustomPropertyEditorRegistrar)
}

SRC / заводной / {} yourpackage /CustomPropertyEditorRegistrar.groovy

class CustomPropertyEditorRegistrar implements PropertyEditorRegistrar {
    @Override
    void registerCustomEditors(PropertyEditorRegistry registry) {
        // Always set the nullable to true and handle not nullable fields through constraints
        registry.registerCustomEditor(Date.class, new CustomDateEditor(new SimpleDateFormat("dd.MM.yyyy"), true));
    }
}

Answer 3

Я создал простой пользовательский тег grails для использования средства выбора даты jQuery UI. Это характеристики следующие:

1. Создает три скрытых поля ввода dateField_day, dateField_month, dateField_year

2. Он отвечает за заполнение этих скрытых полей ввода, когда в календаре выбрана дата.

3. Поддерживает наличие нескольких полей даты без каких-либо конфликтов.

Это предварительные условия:

1. Вы должны правильно установить и настроить jquery в структуре вашего приложения. Это все js, css и темы

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

class JqueryDatePickerTagLib {

def jqDatePicker = {attrs, body -> def out = out def name = attrs.name def id = attrs.id?: name

//Create date text field and supporting hidden text fields need by grails
out.println "<input type=\"text\" name=\"${name}\" id=\"${id}\" />"
out.println "<input type=\"hidden\" name=\"${name}_day\" id=\"${id}_day\" />"
out.println "<input type=\"hidden\" name=\"${name}_month\" id=\"${id}_month\" />"
out.println "<input type=\"hidden\" name=\"${name}_year\" id=\"${id}_year\" />"

//Code to parse selected date into hidden fields required by grails
out.println "<script type=\"text/javascript\"> \$(document).ready(function(){"
out.println "\$(\"#${name}\").datepicker({"
out.println "onClose: function(dateText, inst) {"
out.println "\$(\"#${name}_month\").attr(\"value\",new Date(dateText).getMonth() +1);"
out.println "\$(\"#${name}_day\").attr(\"value\",new Date(dateText).getDate());"
out.println "\$(\"#${name}_year\").attr(\"value\",new Date(dateText).getFullYear());"
out.println "}"
out.println "});"
out.println "})</script>"

} }

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

<g:jqDatePicker name="orderDate"/>

Вы можете найти полную статью по адресу: Мой блог