[Solved] Grid batch editing posting back all rows / changing state of rows

[Kriya]

Hi
My scanario is like this. I upload a file to the server load the data in the controller and display it with the grid.
The user can make changes if that is the wish, and all rows need to be saved to the database, when the Save Changes button is pressed.
How can I get all rows posted back to the server?
I use ajax binding and InCell editing (batch editing)
Since the rows have not been edited in the grid they are not considered by the grid as modified, and not send back in any of the lists.
[Bind(Prefix = "inserted")]IEnumerable<PlayerViewModel> insertedPlayers,
[Bind(Prefix = "updated")]IEnumerable<PlayerViewModel> updatedPlayers,
[Bind(Prefix = "deleted")]IEnumerable<PlayerViewModel> deletedPlayers

There can also be a situation where no rows have been edited in the grid, in this case I still need all rows posted back, so they can be saved to the database.

I am using ASP.NET MVC 3 C#

I thought maybe I can use the SubmitChanges event and somehow add all the rows to the inserted list, but it does not seem to fire if no rows have been changed, and I dont know how I would add the rows either.

I will really appreciate any help on this topic. Currenty I do not have much idea on how to go on with this

[Pechka]

Check this
http://www.telerik.com/help/aspnet-mvc/telerik-ui-components-grid-client-api-and-events.html#OnSubmitChanges 

Send the whole data of the Grid as additional values - $('#Test').data('tGrid').data

Good luck

[Kriya]

Thanks, but I am too much jquery/telerik newbie to get going on that one.

I found an example elsewhere on the forums with the title 'Grid Batch Editing Hide Submit Changes' the attached project there is quite close to something I can use.

I tried modifying the code to the following but it does not work. However it should give an idea of what I am trying to achieve.

<input type="button" name="name" value="Manual Submit" onclick='myfunction()' />
<script type="text/javascript">

        function myfunction() {

            $('#Persons').data('tGrid').hasChanges(true);

            $('#Persons').data('tGrid').submitChanges();

        }

        function onSubmitChanges(e) {

            var grid = $('#Persons').data('tGrid').data;

            e.values.myVal = grid;

        }

    </script>

Is there some property that can be set, that will make submit changes fire also if there are no changes in the grid?
The example has a Person object, I made two rows, and two rows are send with the e.values.myVal of type Person but there are no values, is there some extra step that need to be taken to send the data in a proper way?
Also in this case I am only interested in the extra values, so there is probably a better way all together.

[Kriya]

I have gotten a little farther along on the issue but I am still stuck on one thing. The following code will do the trick of posting the grid data to the server in the right format.


javascript  
           function test() {

            var grid = $('#Persons').data('tGrid').data;

 

            var jsonSerialized = JSON.stringify(grid);

             

            $.ajax({

               type: "POST",

               url: "/Home/Create",

               dataType: "json",

               contentType: "application/json; charset=utf-8",

               data: jsonSerialized,

               success: function (result){

                  console.log(result); //log to the console to see whether it worked

               },

               error: function (error){

                  alert("There was an error posting the data to the server: " + error.responseText);

               }

            });

        }

method in controller receiving the data
       [HttpPost]
        public JsonResult Create(IEnumerable<Person> persons)
        {
            //code for inserting rows from grid in db

            return Json(persons);
        }

however the data posted back is the originally loaded data, not the data with changes applied in the grid. Is there a way to get the data posted back exactly as what you can see in the grid at the time of postback, or some way to reach the changes?

[Pechka]

Yo

Check the methods used to get the modification during batch editing

http://www.telerik.com/help/aspnet-mvc/telerik-ui-components-grid-client-api-and-events.html#ClientMethods 

[Kriya]

Hey Thanks for the tip,
I think that is the right way to go, but I could not get the values out of them on a manual submit, so I gave up for now.
I am not too happy about my final solution but that was the best I could do for now. I simply post back the form twice, first time I post the changes then reload the grid and on the event OnDataBound i submit the full grid data which gives me all the rows with changes.

If anyone have any use of the source code for this I will upload it. But since I am not too happy about my solution I only do it if someone requests that.

[Brad]

Aha.  There is a distinct collection of edits, updates and deletes on the client side.  I was trying to do the same thing -- I was serializing the .data into JSON, posting, and getting the original data in my controller.

Now I serialize this and post to get just the updates in the controller:

$("#myGrid").data("tGrid").changeLog.updated


Hope this helps someone!