我有一个Kendoui网格,我在其中用自动完成作为编辑器填充一列:
{ title: "Desription",
field: 'description',
editor: function(container, options) {
var input = $("<input id='selecteditem' />");
input.attr("name", options.field);
input.appendTo(container);
input.kendoAutoComplete({
dataSource: dataSource,
dataTextField: "name"
});
},
template: "#=name in description#",
width: "300px"
}
其中aoutocomplete数据来自数据库,通过php:
var dataSource = new kendo.data.DataSource({
transport: { read:
{
url: "/cabinet/test/autocomplete/data.php",
dataType: "json"
}
});
和php如下:
$query = ('SELECT shipitem_id AS id, name, description, cat_id, lang_string FROM jml_mss_shipment_items');
$link = mysql_pconnect($dbOptions['host'], $dbOptions['user'], $dbOptions['password']) or die ("Unable To Connect To Database Server");
mysql_select_db($dbOptions['database']) or die ("Unable To Connect To Database");
$arr = array();
$rs = mysql_query($query);
while($obj = mysql_fetch_object($rs)) { $arr[] = $obj; }
header("Content-type: application/json; charset=utf-8");
echo json_encode($arr);
exit();
当我选择项目时,这可以正常工作,但当我移动到下一行时,它会离开
[object Object]
在牢房里。
我已经尝试了所有内容来显示原始值,包括上面的模板(这会导致描述未定义的错误),但没有成功。
我能做些什么来克服这个问题?它一定很简单!
答案 0 :(得分:2)
我在Keno自动完成时遇到了类似的问题(=在空字段中选择一个值时,Kendo将显示[object Object]。当在填充的单元格中选择一个值时,Kendo有时会显示正确的值。)
经过漫长而艰苦的斗争,我发现了这个属性:valuePrimitive(见here)
似乎此属性已添加到2013年第二季度的剑道上。 2013年第一季度剑道上不存在。
一旦我添加了此属性并切换到2013年的Kendo Q2,我的应用程序就开始运行了。
为了完整起见,因为剑道代码的现实例子很少见,这是我完整的Kendo自动完成编辑器功能:
function productNameAutoCompleteEditor(container, options) {
$('<input data-text-field="ContactBusinessName" data-bind="value:' + options.field + '"/>')
.appendTo(container)
.kendoAutoComplete({
autoBind: false,
serverFiltering: true,
filter: "contains",
ignoreCase: true,
valuePrimitive: true, //<<<<<<<<<<<<<<<<<<<<<<<<
dataTextField: "ContactBusinessName",
dataSource: {
type: 'odata',
serverFiltering: true,
serverPaging: true,
pageSize: 40,
transport: {
read:
{
url: "/api/v1/AutoCompleteContacts",
dataType: "json"
},
parameterMap: function (options, type) {
var paramMap = kendo.data.transports.odata.parameterMap(options);
delete paramMap.$inlinecount; // <-- remove inlinecount parameter.
delete paramMap.$format; // <-- remove format parameter.
delete paramMap.$callback; // <-- remove format parameter.
return paramMap;
}
},
schema: {
data: function (data) {
return data; // <-- The result is just the data, it doesn't need to be unpacked.
},
total: function (data) {
return data.length; // <-- The total items count is the data length, there is no .Count to unpack.
}
}
},
select: function (e) {
var item = e.item;
var text = item.text();
// Use the selected item or its text
}
});
}
答案 1 :(得分:0)
问题在于,当您创建新行时,将根据DataSource中的模型定义创建行。由于您使用的是嵌套对象(字段description
实际上是包含object
的{{1}}),因此不会创建。
因此,您应该在模板中检查您是否具有实际价值。类似的东西:
name
有关在您按Enter后立即关闭自动填充功能的问题,您需要从自动填充template: "#= (data.description ? data.description.name : '') #",
事件中调用closeCell
。类似的东西:
change
在此处查看完整的运行示例http://jsfiddle.net/OnaBai/mpNuA/3/