We use cookies to give you the best experience on our website. If you continue to browse, then you agree to our privacy policy and cookie policy.
Unfortunately, activation email could not send to your email. Please try again.

Refresh Grid with updated data

Thread ID:

Created:

Updated:

Platform:

Replies:

118052 Jan 26,2015 04:06 AM Jan 27,2015 07:35 AM ASP.NET Web Forms 1
loading
Tags: Grid
Dirk Strauss
Asked On January 26, 2015 04:06 AM

I bind my grid on page load. I then use an AJAX modal pop-up (displayed on row double-click) to modify the selected row data. On the save button, I update the data to the database. How do I refresh the grid with the updated data from the C# code behind?

Alan Sangeeth S [Syncfusion]
Replied On January 27, 2015 07:35 AM

Hi Dirk,

Thanks for using Syncfusion Products.

We are glad to let you know that we have created a sample based on your requirement and the same can be downloaded from below link.


Sample: http://www.syncfusion.com/downloads/support/directtrac/118052/Sample-959640018-301822669.zip

In the above sample, using “RecordDoubleClick” Grid event we have shown a dialog to display the values of current record and on “click” event of save button in dialog we have used ajax post to update database and then in its success event we have updated Grid using “updateRecord” Grid method. Please refer the following code snippets.

<ej:Grid ID="Grid" runat="server" AllowPaging="true" Width="1500px">
...
<ClientSideEvents RecordDoubleClick="EditHandler" />

        </ej:Grid>

<ej:Dialog ID="basicDialog" Width="550" runat="server" Title="Edit Record"  ShowOnInit="false">

                    <DialogContent>

                    <div id="EditTable"></div>

                        </DialogContent>

</ej:Dialog>

function EditHandler(args) {

...

            $("#EditTable").html(editData)

            $("#basicDialog").ejDialog("open")

        }

        function saveHandler() {

...

            $.ajax({

                url: "Default.aspx/Update",

                data: JSON.stringify({ value: data }),

...

                type:"POST",

                success: function (e) {

                    var obj = $("#Grid").ejGrid("instance");

                    obj.updateRecord("OrderID",e.d);

                    $("#basicDialog").ejDialog("close")

                }

                })

        }

Alternatively, instead of manually opening dialog on record double click we can use “Dialog Editing” feature of Grid to use dialog for Editing and “RemoteSaveAdaptor” of Grid DataManager which has server-side interaction during CRUD operation in Grid.

Please refer the following online sample link for Dialog Editing in Grid and UG Documnetaion for “RemoteSaveAdaptor” of Grid DataManager.

Online Sample: http://mvc.syncfusion.com/demos/web/grid/dialogediting

RemoteSaveAdaptor Documentation: http://help.syncfusion.com/ug/js/documents/crudoperationwithser.htm

Please let us know if you need any further assistance.

Regards,
Alan Sangeeth S



CONFIRMATION

This post will be permanently deleted. Are you sure you want to continue?

Sorry, An error occured while processing your request. Please try again later.

You are using an outdated version of Internet Explorer that may not display all features of this and other websites. Upgrade to Internet Explorer 8 or newer for a better experience.

;