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.

Save entire grid to databse

Thread ID:

Created:

Updated:

Platform:

Replies:

119780 Jul 30,2015 10:52 AM Dec 22,2017 04:39 AM ASP.NET MVC 3
loading
Tags: TreeGrid
vivek
Asked On July 30, 2015 10:52 AM

How can i implement save functionality

i use a strongly typed view and same model is used in data source.

I have a submit button, which will post to an action,


Mahalakshmi Karthikeyan [Syncfusion]
Replied On July 31, 2015 07:36 AM

Hi Vivek,

Thanks for using Syncfusion Product.

We can add, delete and update the TreeGrid data to the database using “EndEdit” and “ActionComplete” client side events. Please refer the below code snippet the do the operation over the TreeGrid data and send it the database via webservice.

@(Html.EJ().TreeGrid("TreeGridContainer").

       //…

       ClientSideEvents(eve =>

       {

           eve.EndEdit("endEdit");

           eve.ActionComplete("ActionComplete");

           eve.Create("create");

       }).

       Datasource(ViewBag.dataSource)

    )

<script type="text/javascript">

        function endEdit(args) {

            var editedRecord = args.data != null ? args.data.item : args.currentValue;

            //This varible holds the data of the edited record. You can updated it to your remote datasource

            $.ajax({

                type: "POST",

                url: "/TreeGrid/Update"//Update is Server side method

                data: editedRecord,

                dataType: "json"

            });

        }


        function ActionComplete(args) {

            var record = args.data;

            if (args.requestType === 'addNewRow') {

                //Newly Added Record is obtained here , which can be updated to database

                addedRecord = args.addedRow;

                $.ajax({

                    type: "POST",

                    url: "/TreeGrid/Add",//Add is Server side method

                    data: addedRecord,

                    dataType: "json"

                });


            } else if (args.requestType === 'delete') {

                var data = args.data;

                var deletedRecord = data.item; //This is the deleted item.

                $.ajax({

                    type: "POST",

                    url: "/TreeGrid/Delete"//Delete is Server side method

                    data: deletedRecord,

                    dataType: "json"

                });


                //If deleted item has child records, we need to delete that too


                if (data.hasChildRecords) {

                    deleteChildRecords(data);

                }

            }

        }


        //Delete inner level child records

        function deleteChildRecords(record) {

            var childRecords = record.childRecords,

                length = childRecords.length,

                count, currentRecord;

            for (count = 0; count < length; count++) {

                currentRecord = childRecords[count];

                var deletedChildRecord = currentRecord.item; //This is the deleted child item.

                //If the above deleted child record has child records, then we need to delete that too.

                if (currentRecord.hasChildRecords) {

                    deleteChildRecords(currentRecord);

                }

            }

        }

    </script>

“EndEdit” client side event is used to get the edited value from the TreeGrid through the “args.data.item” we can pass this data to the database throught the AJAX post method,

“ActionComplete” client side event will be triggered at the time of adding a new row and delete any item from TreeGrid.

args.requestType==”addNewRow” is used to get the newly added item in TreeGrid.

args.requestType==”delete” is used to get the item we select to delete

We have also prepared a sample based on this and you can find the sample under the following location.

Sample: http://www.syncfusion.com/downloads/support/forum/119780/ze/MVC5TreeGrid830103901

Please let us know if you need further assistance on this.

Regards,

Mahalakshmi K.


mg
Replied On December 21, 2017 12:03 PM

I tried the solution below and got it to work for text columns but not for date columns.

I like the RemoteSaveAdaptor for the grid control is there a way to use this for the treegrid?

Or do you have another solution for passing date values?

John Rajaram [Syncfusion]
Replied On December 22, 2017 04:39 AM

Hi Mark, 
In TreeGrid, at present there is no support for “RemoteSaveAdaptor”. But we are able to update the values of date columns to the database from TreeGrid using the code snippets of previous update. We have also prepared the sample with Start date and End date columns. Please find the sample in the following location. 
If this problem still occurs, please revert us by modifying the sample based on your application along with the replication procedure. This would be helpful for us to serve you. 
Please let us know if you need further assistance on this. 
Regards, 
John R 


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.

;