Мой виджет Dijit DateTimeCombo не отправляет выбранное значение при отправке формы - PullRequest
Новая
       13

Мой виджет Dijit DateTimeCombo не отправляет выбранное значение при отправке формы

1 голос
/ 19 мая 2010

Мне нужно создать виджет Dojo, который позволяет пользователям указывать дату и время. я нашел пример реализации, прикрепленный к записи в трекере ошибок Dojo. Это выглядит красиво и в основном работает, но когда я отправляю форму, значение, отправленное клиентом, является не выбранным пользователем значением, а значением, отправленным с сервера.

Какие изменения нужно внести, чтобы виджет отправил значение даты и времени?

Пример использования - визуализация JSP с основными тегами HTML (форма и ввод), затем dojo.addOnLoad функция, которая выбирает базовые элементы по ID, добавляет dojoType атрибут, а dojo.parser.parse () - страница.

Заранее спасибо.

Виджет реализован в двух файлах. Приложение использует Dojo 1.3.

Файл 1: DateTimeCombo.js 

dojo.provide("dojox.form.DateTimeCombo");

dojo.require("dojox.form._DateTimeCombo");
dojo.require("dijit.form._DateTimeTextBox");

dojo.declare(
    "dojox.form.DateTimeCombo", 
    dijit.form._DateTimeTextBox,
    {
        baseClass: "dojoxformDateTimeCombo dijitTextBox",
        popupClass: "dojox.form._DateTimeCombo",
        pickerPostOpen: "pickerPostOpen_fn",        
        _selector: 'date',      
        constructor: function (argv) {},

        postMixInProperties: function()
        {               
            dojo.mixin(this.constraints, {
                /*
                datePattern: 'MM/dd/yyyy HH:mm:ss',  
                timePattern: 'HH:mm:ss',
                */
                datePattern: 'MM/dd/yyyy HH:mm',
                timePattern: 'HH:mm',

                clickableIncrement:'T00:15:00',
                visibleIncrement:'T00:15:00', 
                visibleRange:'T01:00:00'
            });
            this.inherited(arguments);
        },

    _open: function ()
    {
        this.inherited(arguments);
        if (this._picker!==null && (this.pickerPostOpen!==null && this.pickerPostOpen!==""))
        {
            if (this._picker.pickerPostOpen_fn!==null)
            {
                this._picker.pickerPostOpen_fn(this);
            }
        }
    }       

    }
);

Файл 2: _DateTimeCombo.js 

dojo.provide("dojox.form._DateTimeCombo");

dojo.require("dojo.date.stamp");
dojo.require("dijit._Widget");
dojo.require("dijit._Templated");
dojo.require("dijit._Calendar");
dojo.require("dijit.form.TimeTextBox");
dojo.require("dijit.form.Button");

dojo.declare("dojox.form._DateTimeCombo",
    [dijit._Widget, dijit._Templated],
{

    // invoked only if time picker is empty 
    defaultTime: function () {
        var res= new Date();
        res.setHours(0,0,0);
        return res;
    },

    // id of this table below is the same as this.id
    templateString:
    "   <table  class=\"dojoxDateTimeCombo\" waiRole=\"presentation\">\
        <tr class=\"dojoxTDComboCalendarContainer\">\
        <td>\
            <center><input dojoAttachPoint=\"calendar\" dojoType=\"dijit._Calendar\"></input></center>\
        </td>\
        </tr>\
        <tr class=\"dojoxTDComboTimeTextBoxContainer\">\
        <td>\
            <center><input dojoAttachPoint=\"timePicker\" dojoType=\"dijit.form.TimeTextBox\"></input></center>\
        </td>\
        </tr>\
        <tr><td><center><button dojoAttachPoint=\"ctButton\" dojoType=\"dijit.form.Button\">Ok</button></center></td></tr>\
        </table>\
    ",

    widgetsInTemplate: true,

    constructor: function(arg) {},

    postMixInProperties: function() {       
        this.inherited(arguments);      
    },

    postCreate: function() {
        this.inherited(arguments);  
        this.connect(this.ctButton, "onClick", "_onValueSelected");
    },

    // initialize pickers to calendar value
    pickerPostOpen_fn: function (parent_inst) {
        var parent_value = parent_inst.attr('value');
        if (parent_value !== null) {
            this.setValue(parent_value);
        }
    },

    // expects a valid date object
    setValue: function(value) {
        if (value!==null) {
            this.calendar.attr('value', value);
            this.timePicker.attr('value', value);
        }       
    },

    // return a Date constructed date in calendar & time in time picker.
    getValue: function() {
        var value = this.calendar.attr('value');
        var result=value;       
        if (this.timePicker.value !== null) {
            if ((this.timePicker.value instanceof Date) === true) {
                result.setHours(this.timePicker.value.getHours(),
                this.timePicker.value.getMinutes(),
                this.timePicker.value.getSeconds());
                return result;
            }
        } else {
            var defTime=this.defaultTime();
            result.setHours(defTime.getHours(),
                defTime.getMinutes(),
                defTime.getSeconds());
            return result;                  
        }
    },

    _onValueSelected: function() {
        var value = this.getValue();
        this.onValueSelected(value);
    },

    onValueSelected: function(value) {}

});

Ответы [ 2 ]

0 голосов
/ 21 мая 2010

Это начало работать нормально после того, как я добавил метод «сериализации» в DateTimeCombo.js, который создает именно тот формат вывода, который я хочу.

Это кажется мне странным, поскольку в _DateTimeTextBox.js уже есть реализация сериализации, которая должна выводить значение в требуемом формате ISO.

0 голосов
/ 21 мая 2010

Похоже, вы хотите использовать getValue. Соглашение теперь состоит в том, чтобы использовать _getValueAttr, а затем вызывать attr («значение»), но я думаю, что это началось в Dojo 1.4, и этот код должен быть перенесен для использования этих новых шаблонов.

Нет, это значение должно быть объектом даты Javascript, который лучше всего отправлять на сервер с помощью dojo.date.stamp.toISOString ()

...