<div id="grid">
</div>
<script>
//works
var relationshipDataSourcex = [{ kiRelationship: 2, RelationshipText: 'Item 2' },{ kiRelationship: 3, RelationshipText: 'Item 3'}, { kiRelationship: 4, RelationshipText: 'Item 4'}, { kiRelationship: 5, RelationshipText: 'Item 5'}]
// does not work when getRelationship function called from grid (returns N/A), works when grid is in edit/insert mode
var relationshipDataSource = new kendo.data.DataSource({
transport: {
read: {
url: "data/relationshiplistJson.asp",
dataType: "json"
}
},
schema: {
data: "relationshiplist",
model: {
id: "kiRelationship",
fields: {
kiRelationship: { type: "number" },
RelationshipText: { type: "string" }
}
}
}
});
// read does not seem to matter
// relationshipDataSource.read
relationshipDataSource.query
function getRelationship(kiRelationship) {
for (var i = 0; i < relationshipDataSource.length; i++) {
if (relationshipDataSource[i].kiRelationship == kiRelationship) {
return relationshipDataSource[i].RelationshipText;
}
}
return "N/A";
}
function relationshipDropDownEditor(container, options) {
$('<input data-text-field="RelationshipText" data-value-field="kiRelationship" data-bind="value:kiRelationship" />')
.appendTo(container)
.kendoDropDownList({
autoBind: false,
dataSource: relationshipDataSource
});
};
$(document).ready(function () {
relationshipDataSource.read();
dataSource = new kendo.data.DataSource({
transport: {
read: {
url: "data/respondentlistJson",
dataType: "json"
},
update: {
url: "data/respondentlistUpdate",
dataType: "POST" ,
},
create: {
url: "data/respondentlistUpdate",
dataType: "POST"
},
parameterMap: function(options, operation) {
if (operation !== "read" && options.models) {
return {models: kendo.stringify(options.models)};
}
}
},
batch: true,
pageSize: 50,
autoSync: false,
schema: {
data: "respondentlist",
model: {
id: "kiRespondent",
fields: {
kiRelationship: { type: "number", editable: true, defaultvalue: 2 },
cName: { type: "string" ,validation: { required: true } },
cEmail: {type: "string"},
}
}
}
});
$("#grid").kendoGrid({
dataSource: dataSource,
selectable: "row",
pageable: true,
sortable: true,
scrollable: true,
height: 800,
toolbar: ["create"],
columns: [
{ field: "cName", title: "Respondent Name", format: "{0:c}", width: "150px"} ,
{ field: "cEmail", title: "Email", format: "{0:c}", width: "150px"} ,
{ field: "kiRelationship", width: "150px",
editor: relationshipDropDownEditor,
template: '#= getRelationship(kiRelationship) #'
},
{ command: ["edit", "destroy"], title: " ", width: "210px" }],
editable: "inline"
});
});
</script>