我一直在尝试使用标准的html5输入作为kendo ui网格中的单元格编辑器即
<input type="datetime-local" value="1996-12-19T16:39:57" />
我喜欢这个关于日期时间的小部件,因为你可以使用箭头键转到每个日期时间组件,然后使用上下箭头编辑日期时间的那部分。
我已尝试定义以下单元格模板函数。。
function timeEditor(container, options) {
var input = $('<input "datetime-local" name="' + options.field +'" />')
input.appendTo(container);
}
并将其提供给列定义中的适当字段。。
columns: [
{
field: "Time",
title: "Time",
width: "180px",
editor: timeEditor,
},
编辑器被实例化了(我在它命中了一个断点),但我没有得到预期的控件。
我是剑道ui的新手(我正在试用它),所以也许我在这里有什么简单的错误?或者可以使用这个吗?
提前感谢您的帮助尊敬的Peter
你做得对,只是你的HTML是错误的。
<input "datetime-local ...
缺少type=
atrubute名称,应为:
<input type="datetime-local ...
还要记住,在自定义编辑器中,如果有人更改了输入框的值,则必须设置值并更新数据,因此您可能还需要添加.on('change' ...)
事件处理程序。
一个完全工作的编辑器会是这样的:
function timeEditor(container, options) {
var input = $('<input type="datetime-local" name="'
+ options.field
+'" value="'
+ options.model.get(options.field)
+ '" />');
input.on('change', options.model.set(options.field, input.val()));
input.appendTo(container);
}