Add row in kendo grid

4 Answers 4634 Views
Grid
Projects Computerra
Top achievements
Rank 1
Projects Computerra asked on 23 May 2012, 10:44 AM
Hello,

We can easily bind data first time using method provided but then we need to add a single row to
grid using grid.addRow(msg) function but can not bind data to grid and blank row is added to the grid

Please help in it
Richard
Top achievements
Rank 1
commented on 16 Dec 2014, 06:07 PM

So after you add data to the datasource then what do you do.  I wanted to add data based on a button click but do not know how to get it to insert into the grid. 

4 Answers, 1 is accepted

Sort by
0
Atanas Korchev
Telerik team
answered on 25 May 2012, 09:38 AM
Hi,

 You can add a new record to the datasource of the grid:

grid.dataSource.add( { name: "Name", value: "2" } );

Regards,
Atanas Korchev
the Telerik team
Join us on our journey to create the world's most complete HTML 5 UI Framework - download Kendo UI now!
Nathan
Top achievements
Rank 1
commented on 24 Mar 2014, 02:35 PM

I know you guys really want to help.  And I at least appreciate it.

It's incredibly annoying to get a fragment of an answer and not a more detailed explanation or code sample. 
0
Atanas Korchev
Telerik team
answered on 24 Mar 2014, 03:04 PM
Hi Nathan,

Here is an explanation of the code snippet:

1. First you need to get a reference to the client-side object of the grid

var grid = $("#grid").data("kendoGrid");

2. Then you need to call the add method of the grid data source.
grid.dataSource.add( { name: "Name", value: "2" } );

The add method accepts the default data item fields specified as key value pairs.

Regards,
Atanas Korchev
Telerik
 
Join us on our journey to create the world's most complete HTML 5 UI Framework - download Kendo UI now!
 
Nathan
Top achievements
Rank 1
commented on 24 Mar 2014, 03:26 PM

Do you have a more detailed sample.  Not a fragment upon a fragment.

Thanks
Atanas Korchev
Telerik team
commented on 24 Mar 2014, 03:39 PM

Hi Nathan,

Could you please describe how much more detailed you need the example to be? 

Regards,
Atanas Korchev
Telerik
 
Join us on our journey to create the world's most complete HTML 5 UI Framework - download Kendo UI now!
 
Nathan
Top achievements
Rank 1
commented on 24 Mar 2014, 03:41 PM

Never mind, I'll look somewhere else for now
Nathan
Top achievements
Rank 1
commented on 28 Mar 2014, 12:40 PM

No longer an issue.  Thanks for trying and responding.  Would you please close and/or delete post.
0
Atanas Korchev
Telerik team
answered on 18 Dec 2014, 07:42 AM
Hello Richard,

You don't need to do anything else. The grid will display the newly inserted item by itself. Here is a live demo: http://dojo.telerik.com/@korchev/eRoSA

Regards,
Atanas Korchev
Telerik
 
Join us on our journey to create the world's most complete HTML 5 UI Framework - download Kendo UI now!
 
Nisarg
Top achievements
Rank 1
commented on 09 Jan 2015, 10:09 PM

Hi there,

Instead of adding a row, I require to edit one. So what I did was, get the dataSource.data(), then for an item in that data, I used the set method to set a particular field. 

The problem here is that I have 1000 rows in the grid and setting one row, refreshes the whole grid and thus takes long. Is there a way to refresh the grid partially? Or making it less sticky?. 

PS: I know paging the grid would be one solution. But please let me know if there is another way to do this.

Thank you in advance,
Nisarg Patek
Vassili King
Top achievements
Rank 1
commented on 13 Dec 2015, 03:35 AM

[quote]Atanas Korchev said:Hello Richard,

You don't need to do anything else. The grid will display the newly inserted item by itself. Here is a live demo: http://dojo.telerik.com/@korchev/eRoSA
[/quote]

 

This example works, but only in some situations. Here is a situation when it doesn't work as well:

I'm using a data set defined in javascript. I use toolbar: ["save", "cancel", "create"] on my grid (not just "create" used in the example). When I click the Add button, the new record is added, just as expected. I can click it a few more times, make a few edits, click the "Save changes" button, and everything looks good. I add a few more records using the "Add new record" button on the grid itself, then add a few more using the custom Add button again. I make a few more edits in random places in the grid. Then I press the "Save changes" button again. And here is how it all falls apart: when I press the "Cancel Changes" button, all records inserted using the custom "Add" button, even those that were additionally edited, disappear.

 

So, how can this example be modified in order to preserve all records that were saved?

 

Thank you.

0
Alexander Valchev
Telerik team
answered on 17 Dec 2015, 07:55 AM
Hello Vassili,

A given Grid record can disappear when changes are cancelled if its new. New record is a record which has no model.id value.

All records that do not have ID should be saved through the create transport before the user clicks save changes button.

Your particular scenario is a bit unclear because the example provided by my colleague uses inline editing while the toolbar configuration that you have is used in batch editing.

In case you need further assistance please update the Dojo example and list the exact steps that I need to perform in order to reproduce the issue.

Regards,
Alexander Valchev
Telerik
 
Join us on our journey to create the world's most complete HTML 5 UI Framework - download Kendo UI now!
 
Tags
Grid
Asked by
Projects Computerra
Top achievements
Rank 1
Answers by
Atanas Korchev
Telerik team
Alexander Valchev
Telerik team
Share this question
or