Kendo grid Insert new record on the last page, last row position

Question

I'm using kendo grid in inline GridEditMode and GridInsertRowPosition set to bottom. Ajax is used for the data binding. Sorting is enabled and sorted by DateTime field. Page size is set to 10.

To problem occur when there are multiple pages (more that 10 records). I have a javascript function that jumps to the last page and show new row at the bottom. But on some point sort event is triggered, and grid moves to read only mode.

Is there a possibility to prevent Grid sorting only for the case when new row is added?

Any help is welcome. Thank you!

Answer 1

You should define a custom command in your toolbar as:

toolbar   : [
    {
        name : "my-create",
        text : "Add new record"
    }
],

Then, add an event listener to it, using as selector k-grid- plus the name of the command.

$(".k-grid-my-create", grid.element).on("click", function (e) {
}

Finally we will use the ability of Kendo UI datasource for inserting in a specific point:

var dataSource = grid.dataSource;
var total = dataSource.data().length;
dataSource.insert(total, {});
dataSource.page(dataSource.totalPages());
grid.editRow(grid.tbody.children().last());

Please, realize that we should move to the last page after inserting the row. This should be ok with having columns sorted by date.

Please, check the code here: http://jsfiddle.net/OnaBai/sAVGk/

Answer 2

Check out new kendo setting: createAt

just set it to the 'bottom':

...
createAt: 'bottom',
...

Answer 3

Is there a possibility to prevent Grid sorting only for the case when new row is added?

In add button handler use next code:

        var table = $("#gridId").data("kendoGrid");
        var sorting = table.dataSource.sort();

        if (sorting) {
            table.dataSource.sort(null);
        }
        table.addRow();

Sorting will be removed and new item will be in edit mode.

Answer 4

If it is an MVC Kendo Grid, attach .CreateAt(GridInsertRowPosition.Bottom) attribute. Below is the sample line,

.Editable(e => e.Mode(GridEditMode.InCell).CreateAt(GridInsertRowPosition.Bottom))