Я унаследовал фрагмент кода, изначально требовавший только редактируемую дату, и это было реализовано с использованием jQuery datatables, jquery-editable и datepicker.
это текущий рабочий код только для даты
$('.editdate')
.editable(function (value, settings) {
if ((value == null) || (value == '')) {
return ($(this)
.parent()
.find('label')
.text());
}
hasBeenEdited(this);
return (value);
}, {
type: 'datepicker',
datepicker: {
dateFormat: 'mm-dd-yy',
changeMonth: true,
changeYear: true
}
});
Теперь меня попросили включить время с датой (база данных и модель на сервере были изменены на временную метку), и я пытаюсь включить аддон datetimepicker.
Когда я делаю это вне редактирования, используя $(".editdatetime").datetimepicker()
работает так, как ожидалось, но когда я пытаюсь сделать это с помощью редактируемой функции, я получаю следующие ошибки
firefox: TypeError: $.editable.types[settings.type] is undefined
chrome: Uncaught TypeError: Cannot read property 'plugin' of undefined
это мое редактируемое для datetimepicker
$('.editdatetime')
.editable(function (value, settings) {
if ((value == null) || (value == '')) {
return ($(this)
.parent()
.find('label')
.text());
}
hasBeenEdited(this);
return (value);
}, {
type: 'datetimepicker',
datetimepicker: {
dateFormat: 'mm-dd-yy',
changeMonth: true,
changeYear: true,
showHour: true,
showMinute: true
}
});
Любые рекомендации или помощь приветствуются
Поэтому я, наконец, понял, что мне нужно добавить тип ввода datetimepicker
в редактируемый. Поэтому мне удалось решить это, используя следующее:
$.editable.addInputType( 'datetimepicker', {
/* create input element */
element: function (settings, original) {
var form = $(this),
input = $('<input />');
input.attr('autocomplete', 'off');
form.append(input);
return input;
},
/* attach jquery.ui.datetimepicker to the input element */
plugin: function (settings, original) {
var form = this,
input = form.find("input");
// Don't cancel inline editing onblur to allow clicking datetimepicker
settings.onblur = 'nothing';
datetimepicker = {
onSelect: function () {
// clicking specific day in the calendar should
// submit the form and close the input field
form.submit();
},
onClose: function () {
setTimeout(function () {
if (!input.is(':focus')) {
// input has NO focus after 150ms which means
// calendar was closed due to click outside of it
// so let close the input field without saving
original.reset(form);
} else {
// input still HAS focus after 150ms which means
// calendar was closed due to Enter in the input field
// so lets submit the form and close the input field
form.submit();
}
// the delay is necessary; calendar must be already
// closed for the above :focus checking to work properly;
// without a delay the form is submitted in all scenarios, which is wrong
}, 150);
}
};
if (settings.datetimepicker) {
jQuery.extend(datetimepicker, settings.datetimepicker);
}
input.datetimepicker(datetimepicker);
}
});