This question is locked. New answers and comments are not allowed.
Hello everyone,
i'm having bit of a trouble figuring out how to implement this scenario.
Lets say i have an array of data similar to this.
and a grid view with a combobox that holds this data array.
I would like to add items in grid by selecting a product from a combobox, and other columns from that row will be filled with selected product data.
I got stuck with this code, it generates combobox, and i can select data, but every time i select an item id instead of name shows, and other columns don't update.
and the function
i'm having bit of a trouble figuring out how to implement this scenario.
Lets say i have an array of data similar to this.
var products=[{
"id"
: 1,
"name"
:
"Product name"
,
"price"
: 1230.23,
"description"
:
"Some description"
,
"category"
: {
"id"
: 16,
"name"
:
"New category"
,
}....];
I would like to add items in grid by selecting a product from a combobox, and other columns from that row will be filled with selected product data.
I got stuck with this code, it generates combobox, and i can select data, but every time i select an item id instead of name shows, and other columns don't update.
var
dataSource =
new
kendo.data.DataSource({
pageSize : 20,
data : selected,
autoSync :
true
,
schema : {
model : {
id :
"id"
,
fields : {
id : {
editable :
false
,
nullable :
true
},
name : {
validation : {
required :
true
}
},
price : {
type :
"number"
,
validation : {
required :
true
,
min : 1
}
}
}
}
}
});
$(
"#grid"
).kendoGrid({
dataSource : dataSource,
pageable :
true
,
height : 550,
toolbar : [
"create"
],
columns : [ {
field :
"name"
,
title :
"Product Name"
,
width :
"180px"
,
editor : productDropDownEditor
},{
field :
"price"
,
title :
"Unit Price"
,
format :
"{0:c}"
,
width :
"130px"
}, {
command :
"destroy"
,
title :
" "
,
width :
"120px"
} ],
editable :
true
});
and the function
function
productDropDownEditor(container, options) {
console.log(options);
$(
'<input required data-text-field="name" data-value-field="id" data-bind="value:'
+ options.field +
'"/>'
)
.appendTo(container)
.kendoDropDownList(
{
autoBind :
false
,
dataSource : {
data:products
}
});
}