I have a kendo grid in which one column can have null values. But I don't see the grid populating when there are null values. My code is here:
$(document).ready(function() {
$("#grid").kendoGrid({
dataSource: gridData,
columns: [{
field: "name",
title: "Name"
}, {
field: "result",
title: "Result",
template: "# if (result == null) { #" +
"<span data-content=' '></span> } #" +
"# } else { #" +
"<span data-content=\"#: result#\"> </span>"
}]
});
});
Can anyone help where I went wrong with this.
I have a kendo grid in which one column can have null values. But I don't see the grid populating when there are null values. My code is here:
$(document).ready(function() {
$("#grid").kendoGrid({
dataSource: gridData,
columns: [{
field: "name",
title: "Name"
}, {
field: "result",
title: "Result",
template: "# if (result == null) { #" +
"<span data-content=' '></span> } #" +
"# } else { #" +
"<span data-content=\"#: result#\"> </span>"
}]
});
});
Can anyone help where I went wrong with this.
Share Improve this question edited Jun 7, 2016 at 19:52 Sri asked Jun 7, 2016 at 19:45 SriSri 6132 gold badges7 silver badges20 bronze badges2 Answers
Reset to default 10I'm not sure if you really need to set data-content
yourself... if you just want to set an empty string instead of a null value, you can do it with a much simpler template:
$(document).ready(function() {
$("#grid").kendoGrid({
dataSource: gridData,
columns: [{
field: "name",
title: "Name"
}, {
field: "result",
title: "Result",
template: "#= (result == null) ? ' ' : result #"
}]
});
});
To make it easier for control/readable you can do this
$(document).ready(function() {
$("#grid").kendoGrid({
dataSource: gridData,
columns: [{
field: "name",
title: "Name"
}, {
title: "Result",
template: function (dataItem) {
if (dataItem.result == null)
return 'Placeholder';
else
return dataItem.result;
}
}]
});
});
Personally, don't like Kendo interpolation '#', it's hard to read when there is more logic in the template, which might lead to more interpolation '#'. Make code not readable caused the start point and the endpoint are both used '#'.