This is a migrated thread and some comments may be shown as answers.

Canceling popup editor removes row in grid

6 Answers 324 Views
Data Source
This is a migrated thread and some comments may be shown as answers.
Lars Lykke
Top achievements
Rank 1
Lars Lykke asked on 13 Mar 2013, 11:49 AM
I saw some similar posts, but this issue still happens to me.
I have added id, and I think it should work.

Demo here:

http://jsfiddle.net/5nJPH/36/

to reproduce:

1. click edit button
2. click cancel
3. observe row disappear from grid.

I tried using datasource like this:

$('#grid').kendoGrid({

                dataSource:
                    {
                        data: dataSourceSelectedItems.data(),

                    },
                schema:
                    {
                        model: {
                            id: "Id"
                        }
                    }

and it seems to take care of the row-removed issue, but puts the row in a weird state where update button no longer works.

Help?

6 Answers, 1 is accepted

Sort by
0
Iliana Nikolova
Telerik team
answered on 15 Mar 2013, 12:08 PM
Hi Lars,

In order to implement CRUD operations using local data and avoid the problem with disappearing records I recommend you using custom transport functions. Also, you should sync() the dataSource after adding the items. For your convenience I updated the jsFiddle example.  
  
Regards,
Iliana Nikolova
the Telerik team
Join us on our journey to create the world's most complete HTML 5 UI Framework - download Kendo UI now!
0
Lars Lykke
Top achievements
Rank 1
answered on 18 Mar 2013, 12:46 PM
Thank you very much, it worked like a charm!
0
Chrys
Top achievements
Rank 1
answered on 26 Jun 2013, 04:36 PM
As a side note you may want to make sure that when you are getting data for an edit that what you specified in in .Model(model =>
            {
                model.Id(currentAccount => currentAccount.UserID);
}
has a value or the same problem will occur. My problem on my edit was that the objects I was handing it didn't have the UserID values set for the objects I wanted to edit. So the grid thought I was adding things not editing.
0
Jackie
Top achievements
Rank 1
answered on 08 Nov 2016, 06:27 AM

Hi,

I got the same problem here. After I click Cancel button, the top record disappears.

My code is posted below, please advise. Thanks.

 

var dataSource = new kendo.data.DataSource({
        pageSize: 18,
        transport: {
            read: function (options) {
                $.ajax({
                    url: baseUri + "/GetCommodities",
                    dataType: "json",
                    success: function (result) {
                        options.success(result);
                    },
                    error: function (jqXHR, textStatus, errorThrown) {
                        options.error(jqXHR);
                    }
                });
            },
            create: function (options) {
                if (options.data) {
                    options.data.CommodityId = 0;
                    options.data.MaxPrice = parseFloat(options.data.MaxPrice);
                    options.data.MaxTonnage = parseFloat(options.data.MaxTonnage);

                    $.ajax({
                        url: baseUri + "/SaveCommodity",
                        dataType: "json",
                        data: options.data,
                        type: "Post",
                        success: function (result) {
                            if (result === false) {
                                alert("Error in adding the record.");
                            }
                            options.success(result);
                            $("#adminGrid").data("kendoGrid").dataSource.read();
                        },
                        error: function (jqXHR, textStatus, errorThrown) {
                            console.log("Add: " + errorThrown + "-" + jqXHR.responseText);
                            alert("Failed inserting the new record: " + jqXHR.responseText);
                            options.error(jqXHR);
                        }
                    });
                }
            },
            update: function (options) {
                if (options.data) {

                    options.data.MaxPrice = parseFloat(options.data.MaxPrice);
                    options.data.MaxTonnage = parseFloat(options.data.MaxTonnage);

                    $.ajax({
                        url: baseUri + "/SaveCommodity",
                        dataType: "json",
                        data: options.data,
                        type: "Post",
                        success: function (result) {
                            if (result === false) {
                                alert("Error in updating the record.");
                            }
                            options.success();
                            $("#adminGrid").data("kendoGrid").dataSource.read();
                        },
                        error: function (jqXHR, textStatus, errorThrown) {
                            console.log("Save: " + errorThrown + "-" + jqXHR.responseText);
                            alert("Failed updating the new record: " + jqXHR.responseText);
                            options.error(jqXHR);
                        }
                    });
                }
            }
        },
        schema: {
            model: {
                id: "CommodityId",
                fields: {
                    Commodity: { 
                        editable: false
                    },
                    MaxPrice: {
                        type: "decimal", validation: { required: true }
                    },
                    MaxTonnage: {
                        type: "decimal", validation: { required: true }
                    }
                }
            }
        },
        error: function (e) {
            if (e && e.errors) {
                console.log("DataSource: " + e.errors);
            }
        }
    });

0
Jackie
Top achievements
Rank 1
answered on 08 Nov 2016, 06:29 AM

Hi,

I got the same problem here. After I click Cancel button, the top record disappears. What caused this?

0
Boyan Dimitrov
Telerik team
answered on 10 Nov 2016, 09:22 AM

Hello Jackie,

Most probably the top record disappears because it is not synced with the server. If there are some changes not synced with the server they will be reset as soon as the cancel button is clicked.

Could you please explain what is the exact response you are retrieving from the create method on the server? Based on the provided code for the transport.create could you please provide the content of the result variable: 

create: function (options) {
                if (options.data) {
                    options.data.CommodityId = 0;
                    options.data.MaxPrice = parseFloat(options.data.MaxPrice);
                    options.data.MaxTonnage = parseFloat(options.data.MaxTonnage);
 
                    $.ajax({
                        url: baseUri + "/SaveCommodity",
                        dataType: "json",
                        data: options.data,
                        type: "Post",
                        success: function (result) {
                            if (result === false) {
                                alert("Error in adding the record.");
                            }
                            options.success(result);
                            $("#adminGrid").data("kendoGrid").dataSource.read();
                        },
                        error: function (jqXHR, textStatus, errorThrown) {
                            console.log("Add: " + errorThrown + "-" + jqXHR.responseText);
                            alert("Failed inserting the new record: " + jqXHR.responseText);
                            options.error(jqXHR);
                        }
                    });
                }
            },

Regards,
Boyan Dimitrov
Telerik by Progress
 
Build rich, delightful, *native* Angular 2 apps with Kendo UI for Angular 2. Try it out today! Kendo UI for Angular 2 (currently in beta) is a jQuery-free toolset, written in TypeScript, designed from the ground up to offer true, native Angular 2 components.
 
Tags
Data Source
Asked by
Lars Lykke
Top achievements
Rank 1
Answers by
Iliana Nikolova
Telerik team
Lars Lykke
Top achievements
Rank 1
Chrys
Top achievements
Rank 1
Jackie
Top achievements
Rank 1
Boyan Dimitrov
Telerik team
Share this question
or