setOptions
Sets the options of the Grid. Use this method if you want to enable/disable a particular feature/option or to load the complete state obtained previously with the getOptions method.
When setOptions
is called, the Grid widget will be destroyed and recreated. If the widget is bound to remote data, a new read request will be made.
There are a few important things to keep in mind when using
getOptions
andsetOptions
.
- calling
setOptions()
in a Grid event handler is not possible.- calling
setOptions()
in a function, which is related to the Grid's databinding mechanism may cause an endless loop.JSON.stringify()
cannot serialize function references (e.g. event handlers), so if stringification is used for the retrieved Grid state, all configuration fields, which represent function references, will be lost. You have two options to avoid this limitation: use a custom implementation to serialize JavaScript functions, or add the function references back to the deserialized configuration object before passing it to thesetOptions
method.- When using the Grid MVC wrapper, any server templates will not be retrieved by the
getOptions
method (e.g. toolbar or header templates with@<text></text>
razor syntax). This is because the server templates are rendered server-side and do not have corresponding configuration options included in the JavaScript initialization statement that creates the Grid object client-side. As a result, the templates will be lost once thesetOptions()
method is invoked. There are two options to avoid the issue - use JavaScript initialization instead of an MVC wrapper, or add template configuration to the retrieved Grid state with the JavaScript equivalent syntax (e.g. headerTemplate and toolbar).
Parameters
options Object
The configuration options to be set.
Example - set sortable feature of the Grid to true
<div id="grid"></div>
<script>
$("#grid").kendoGrid({
columns: [
{ field: "name" },
{ field: "age" }
],
dataSource: [
{ name: "Jane Doe", age: 30 },
{ name: "John Doe", age: 33 }
]
});
var grid = $("#grid").data("kendoGrid");
grid.setOptions({
sortable: true
});
</script>
When used for AngularJS, the $scope
should be passed to the Grid options. By default, the Grid when initialized expects such logic.
$scope.grid.setOptions($.extend({}, options, {
$angular: [$scope]
}));