Telerik UI for Windows 8 HTML

When you enable CRUD operations in RadGrid, you may want to pre-populate some fields in the grid on create operation. This can easily be achieved through the model of the underlying DataSource.

How to Specify Default Insert Values Statically

To display default values when you insert a new item in RadGrid, you can set the defaultValue property for the respective fields, listed in the dataSource.model.fields object. For example, if you insert a new record in a RadGrid with data fields: Name, City, JobTitle and AccessType and you want to predefine the City, JobTitle and AccessType values, you will need a model definition like the one shown below.

Grid Definition Copy imageCopy
<div id="grid1" data-win-control="Telerik.UI.RadGrid" data-win-options="{
        width: 800,
        dataSource: {
            data: Configuration.SampleData,
            schema: {
                model: {
                    id: 'RecID',
                    fields: {
                        RecID: {
                            type: 'number',
                            editable: false,
                            nullable: true
                        Name: {
                            validation: {
                                required: true
                        City: {
                           defaultValue: 'Boston'
                        JobTitle: {
                            defaultValue: 'Sales Associate'
                        AccessType: {
                            type: 'number',
                            defaultValue: 2
        columns: [
             {field: 'Name', width: 200},
             {field: 'City'},
             {field: 'JobTitle', title: 'Job Title', width: 350},
             {field: 'AccessType', title: 'Access Type', width: 150, format: '{0:N0}', values: [1, 2, 3]}
        editable: {
            enabled: true,
            mode: 'row'
        theme: 'light',
        onedit: Configuration.edit

For clarity, this is the data definition:

Data Array Copy imageCopy
SampleData: [{
    Name: 'Kenya Bruni',
    City: 'Anchorage',
    JobTitle: 'Chief Accounting Officer',
    RecID: 1,
    AccessType: 3
}, {
    Name: 'Karry Evertt',
    City: 'San Antonio',
    JobTitle: 'Chief Information Technology Officer',
    RecID: 2,
    AccessType: 3
}, {
    Name: 'Jacklyn Emayo',
    City: 'Boston',
    JobTitle: 'Chief Development Officer',
    RecID: 3,
    AccessType: 2
}, {
    Name: 'Robin Crotts',
    City: 'New York',
    JobTitle: 'Chief Financial Officer',
    RecID: 4,
    AccessType: 3

This image shows how the above-defined RadGrid will look if you insert a new row:


The default values set through the model cannot be changed dynamically because, once set, the model cannot be modified.

How to Specify Default Insert Values Dynamically

If you want to dynamically set the default insert values for RadGrid, you can handle the onedit RadGrid event and manually set the values to the edit control(s). If we take the above example and want to set the City value dynamically, the code would look like this:

Set Values Dynamically Copy imageCopy
edit: WinJS.Utilities.markSupportedForProcessing(function (e) {
    $("td .k-input[name=City]", e.container) //access edit control
    .val("Boston") //set the default value
    .change(); //trigger change in order to notify the model binding

See Also