Ответ 1
Любая конкретная причина, по которой вы хотите сделать это в методе изменения?
Почему не что-то вроде этого?
this.change(function(event) {
});
this.bind('blur keypress',function(e){
if (moment($(this).val(), "DD/MM/YYYY", true).isValid()) {
var inputFieldDate=getFmtDate($(this).val());
picker.set('select',inputFieldDate);
}
});
Это функция утилиты для анализа даты в формате DD/MM/YYY
и получения объекта Date javascript
function getFmtDate(s){
var valx=new Array();
if(s!=null && s.length>0){
valx = s.split('/');
}
var d = new Date(valx[2],valx[1]-1,valx[0]);
return d;
}
Это работает для меня.
Обновление:
Как только вы присоедините виджет к элементу html, обычные функции обратного вызова событий работают не так, как вы ожидаете. Их функциональность переопределена виджетами. Вы не можете использовать функции так же, как вы привыкли, и должны найти обходное решение. Короче говоря, вы не можете использовать функцию change
для установки или отмены даты, потому что задано триггером событие change
.
В вашем случае вы хотите решить несколько проблем, которые являются очень распространенными проблемами. Вы должны быть в состоянии получить множество примеров в Интернете, чтобы достичь каждого из них. То, что я сделал, это всего лишь один из способов сделать это.
- Заполнение формы нестандартным способом при загрузке страницы.
- Инициализировать различные плагины со значениями из формы, когда страница загружается
- Инициализировать содержимое из скрытых полей, когда форма загружает и обновляет скрытые поля при отправке формы.
- Извлеките значения по имени (скрытых полей) и используйте их для инициализации виджетов.
Я использовал blur keypress
, чтобы дать вам представление о том, что все ваши требования могут быть обработаны без использования change
. Вы используете события, которые работают на вас. Вы можете установить дату привязки объекта picker
to calendar
с ключевым словом this
и получить доступ к нему из своего экземпляра, как показано ниже.
(function($) {
$.fn.calendar = function(options) {
// Options du datepicker
var settings = $.extend({
editable: true,
format: 'dd/mm/yyyy',
formatSubmit: 'ddmmyyyy'
},
options
);
this.pickadate(settings);
//var picker = this.pickadate(''); will not work
this.picker = this.pickadate('picker');
this.change(function(event) {
});
this.bind('blur keypress',function(e){
if (moment($(this).val(), "DD/MM/YYYY", true).isValid()) {
var inputFieldDate=getFmtDate($(this).val());
picker.set('select',inputFieldDate);
}
});
var $triggerIcon = $('<div class="col s2 center-align"><a class="btn-floating btn-large waves-effect waves-light trigger-datepicker">Date</a></div>');
$triggerIcon.click(function(event) {
event.stopPropagation();
event.preventDefault();
picker.open();
});
this.parent().after($triggerIcon);
// Resolves picker opening for thing
this.next().unbind("focus.toOpen");
return this;
};
}(jQuery));
Чтобы установить дату:
//This is how you set a date
var cal = $('.datepicker').calendar();
//You can access picker because we changed
//var picker to
//this.picker above in fn.calendar
cal.picker.set('select', getFmtDate($("[name=hiddenDate]").val()));
// The syntax is
//cal.picker.set('select', new Date());
$('#formulaireDate').validate();
Вам нужно преобразовать дату в Date()
. Функция ниже должна дать вам представление. Вы также можете использовать плагины, например плагин jquery dateFormat.
function getFmtDate(s){
var valx=new Array();
if(s!=null && s.length>0){
valx = s.split('/');
}
var d = new Date(valx[2],valx[1]-1,valx[0]);
return d;
}
Это ваш html.
<div class="row">
<div class="col s4">
<input type="text" class="datepicker" />
<input name="hiddenDate" type="hidden" value="12/12/2016">
</div>
</div>