1
votes

I am using Kendo UI v2014.1.528

Binding data in Kendo Grid like below

 $("#list485").kendoGrid({
                dataSource: dataSource,
                sortable: true,
                columns: [
                    //Column List
                ]
               );

It gives me a grid with "Sort" and "Add New Record" feature.

If i click on "Add New Record" button, it adds an empty record in the first row of the grid. This is fine.

But if i sort the grid on any column and then click on "Add New Record" button, the empty row for new record gets added somewhere in between the existing rows.

Can someone help me understand and fix this issue?

1
Several questions: 1. The code as you show, doesn't show neither "Add New Record" nor Sortable. 2. I'm not able to reproduce what you say about "somewhere in between the existing rows". Can you show an actual code including dataSource model definition or even better some code in JSFiddle (or here) that reproduces what you say? Check the code that I've prepared here: dojo.telerik.com/@OnaBai/EXer - OnaBai
Thanks for reply OnaBai. Even in your example, I can see this issue. Sort the Kendo Grid column and a add new record.. the new record row will show in different row positions.. - Kalyan Chakravarthy S
How do you reproduce it? I can only see inserting it at the top or the bottom. - OnaBai
Ok.. I meant inserting in bottom is also an issue.. but in my case i have defined the column type as number and the input data had string values.. In this issueLink.. sort the Price column and try adding a new record.. you will see the record in between existing rows.. for my issue.. can you please help me to configure the kendo gird so that the new record row always in the top, not in bottom in any case? - Kalyan Chakravarthy S
@KalyanChakravarthyS as per your link posted above comment, In Price column some value coming int and some like string, that why it's create problem. Try like this : dojo.telerik.com/orEq if any concern let me know. - Jaimin

1 Answers

2
votes

You can clear the sorting or filtering from the Kendo grid while clicking on the custom Add button. I have added the Razor code

  1. Code to add a custom Add button to catch the Javascript

    .ToolBar(toolbar =>{                        toolbar.Custom().Name("cmdAddRecord")
                    .Text("Add New Record")
                    .HtmlAttributes(new { @id = "cmdAddRecord"   }); })
    
  2. Javascript to clear the sorting and filtering.

    $("#cmdAddRecord").click(function (e) {
    
        var grid= $("#Grid").data("kendoGrid");
        var sorting = grid.dataSource.sort();
        var filtering = grid.dataSource.filter();
        if (filtering) {
            grid.dataSource.filter(null);
        }
        if (sorting) {
            grid.dataSource.sort(null);
        }
        grid.addRow();
        e.preventDefault();
    
    });