Hi
I had been adding to the following post (which relates to igGrid) but I think that I have a problem specific to igHierarchicalGrid so have started a new post:
http://ko.infragistics.com/community/forums/p/66850/432682.aspx#432682
I have an MVC 4 website running with ignite ui 13.1. My save button invokes a controller method which returns a JSON result, as described in the above post:
The controller save method ends like this:
Dictionary<string, object> response = new Dictionary<string, object>();string strResponseMessage = string.Empty;JsonResult result = new JsonResult();
if (strSaveResult.Length == 0){ response.Add("Success", true); result.Data = response;}else{ response.Add("Success", false); response.Add("ErrorMessage", strResponseMessage);}result.Data = response;return result;
I am using the igHierarchical grid bound to a dataset with two tables in a parent/child relationship.
The problem is that I can't seem to save my data and process the success/error message via a call to changesSuccessHandler. I can save my data or call changesSuccessHandler but I can't do both.
changesSuccessHandler is a javascript function in the view. The following code snippets are behind my save button's click event.
Lines like "$("#TimesheetGrid").igHierarchicalGrid("saveChanges");" call the save method in my controller (apart from in my first example with which no save happens at all - scripting error).
eg:
This does not work at all - my save processing does not invoke and throws an error:$("#TimesheetGrid").data("igHierarchicalGrid").dataSource._addChangesSuccessHandler(changesSuccessHandler);$("#TimesheetGrid").igHierarchicalGrid("saveChanges");
I get this in the browser console for this error, which makes me think that for some reason I can't add the success handler to a hierarchical grid:
Uncaught TypeError: Cannot call method '_addChangesSuccessHandler' of undefined VM132:3$.bind.click VM132:3f.event.dispatch jquery-1.7.1.min.js:3h.handle.i
This saves changes to my lower band but does not fire changesSuccessHandler:
$("#TimesheetGrid").data("igGrid").dataSource._addChangesSuccessHandler(changesSuccessHandler);$("#TimesheetGrid").igHierarchicalGrid("saveChanges");
This fires changesSuccessHandler but DOES NOT save the changes to my lower band of data:$("#TimesheetGrid").data("igGrid").dataSource._addChangesSuccessHandler(changesSuccessHandler);$("#TimesheetGrid").igGrid("saveChanges");
It feels like the changesSuccesSHandler callback only works for igGrid ie the first, top level, band in my data so I must be missing something here.
I am at a loss as to what to try next. I am using the changesSuccessHandler to display success or error messages depending upon what happens in the save.
Regards,
Graeme
I have carried out some more testing and have found something interesting.
If I use:
and I change both a header row and a child row I get all changes saved and changesSuccessHandler is called.
If I only change the child row I get the changes saved but I do not get a call to changesSuccessHandler.
This sort of makes sense to me - I just need to tell it to call changesSuccessHandler for all changes, not just changes to the header band.
Hello Graeme,
Thank you for your patience. I see that you are using the _addChangesSuccessHandler method in IGG (IGGrid), which is not exposed in the IGHG (IGHierarchicalGrid). As the nomenclature goes, the functions names starting with '_' are internal methods for IG controls, and are not to be used for routine development. The public methods, options and events exposed by IGG and IGHG are usually consistent, but the same cannot be said about internal methods. Not only is the functionality not guaranteed, but the name of these internal methods can change in the newer builds without any indication. Hence, for the above reasons, I would encourage you to move away from internal methods.
To achieve what you are looking for, I would ask you to take a look at the igGridUpdating API documentation under https://www.igniteui.com/help/api/2013.2/ui.iggridupdating_hg. There are a few more granular event handlers under this section, which you may be able to take advantage of.
Let me know if this answers your question.
Sincerely,
Malav Patel
Hi Malav
Tanks for the reply.
I totally understand what you say about the internal methods and am more than happy to use another technique.
The problem that I am trying to address is to run a function in my MVC view when the grid has finished updating. That function needs to change the view based upon the save result returned from the controller method that carries out the save. The response that I am returning contains either a success message or an error message which the end user needs to see.
This result is returned in JSON as per your samples. See this page:
http://help.infragistics.com/Doc/jQuery/Current/CLR4.0?page=igGrid_Updating.html
specifically the bit headed "Persisting row transactions"
The trouble is that I just don't see a suitable event in the page you directed me to that will let me trap the save result - plenty for cell and edit operations but none for grid save result.
Can you tell me how to trap the JSONResult returned form the controller in my view?
Hopefully I am missing something simple.
Thank you for your response. From 13.1.2292 we introduced a success and error callback parameters to the igDatSource.saveChanges and igGrid.saveChanges APIs. Also we added igGridUpdating.saveChangesErrorHandler and igGridUpdating.saveChangesSuccessHandler callback options. Unfortunately we didn’t add success and error callbacks to igHierarchicalGrid.saveChanges in 13.1.2292, but we will do this for the next SR.
In the meantime, you may be able to use igGridUpdating.saveChangesSuccessHandler option which will satisfy your needs because for performance reasons we make only one update request in igHierarchicalGrid.saveChanges (i.e. the first igGridUpdating.saveChangesSuccessHandler callback that will indicate that the AJAX operation was completed successfully). As a side effect you can experience several executions of igGridUpdating.saveChangesSuccessHandler, one for each layout which had pending changes.
Please also note that the GridUpdating.SaveChangesSuccessHandler and GridUpdating.SaveChangesErrorHandler are not working right now for grid MVC helper wrapper because of a bug, but that will be resolved in the next SR (planned for end of this week).
The link to using saveChangesSuccessHandler can be found under https://www.igniteui.com/help/api/2013.2/ui.iggridupdating#options. Here is an example code on how to initialize it on initialization time:
$("#grid").igHierarchicalGrid({
features: [
{
name: "Updating",
saveChangesSuccessHandler : function (data) {
// Put your code here
}
]
});
Or at runtime.
//Set
$("#grid").igGridUpdating("option", "saveChangesSuccessHandler", function(data) {
$("#message").text("Changes were saved successfully").fadeIn(3000).fadeOut(5000);
I hope this answers your questions.
Thanks for the response. I missed saveChangesSuccessHandler because I was looking under Events rather than Options. That all makes perfect sense and I shall give it a go.
I have just had a look at my Ignite UI version - I'm on 13.1.20131.2217 so I think that first step is for me to upgrade to the latest SR as my version pre-dates the release that you mentioned.
I'll mark your post as answer once I've upgraded and tried it out.
I'm following up with you to check if there are any more questions with the implementation suggested.
Thank you,
I needed a newer version of Ignite UI to implement your suggestion so I am just setting up a new virtual machine with Visual Studio 2013, Ignite UI 13.2, SQL Server.....
When I finally get to where I need to be I will let you know how I got on.
I'm following up on your question. Did you get a chance to upgrade to IgniteUI 13.2? Please let me know if you have any further questions.