I have a grid which I am attempting to update using a webmethod in aspx. I get an error coming back about server not sending a proper response back. When I debug, the method is not being called. I think it has to do with the method signature. The grid loads up just fine and the paging works as well. I have simplified the grid but subbing in a json object for the data source.
var subs = [
{ IDX: 1, BarraModelId: "USE3L", BarraId: "KORACL3", AltBarraId: "USA9EX1" }
];
$("#SecuritySubs").igGrid({
columns: [
{ key: "IDX", dataType: "number", width: "10px" },
{ headerText: "Barra Model ID", key: "BarraModelId", dataType: "string", width: "150px"},
{ headerText: "Barra Id", key: "BarraId", dataType: "string", width: "150px" },
{ headerText: "Alternate Barra Id", key: "AltBarraId", dataType: "string", width: "150px" }
],
autoCommit: true,
defaultColumnWidth: 100,
alternateRowStyles: false,
primaryKey: "IDX",
requestType: "POST",
responseDataKey: "d.Items",
caption: "Barra Security Substitution",
// dataSourceUrl: "Main.aspx/GetSubstitutions",
dataSource: subs,
updateUrl: "Main.aspx/Update",
autoGenerateColumns: false,
features: [
{
name: "Filtering",
type: "local",
mode: "advanced",
filterDialogWidth: 600,
filterDialogHeight: 350,
filterDialogColumnDropDownDefaultWidth: 175,
filterDialogFilterDropDownDefaultWidth: 125,
filterDialogContainment: "window"
},
name: "Sorting",
columnSettings: [
columnIndex: 0,
allowSorting: false
}]
name: "Paging",
type: "remote",
pageSize: 50,
recordCountKey: "d.TotalRecordsCount",
pageSizeUrlKey: "pageSize",
pageIndexUrlKey: "pageIndex",
currentPageIndex: 0,
persist: false,
pageIndexChanging: function (event, args) {
pageIndexChanged: function (event, args) {
}
name: "Selection",
mode: "row"
name: "Updating",
enableAddRow: true,
editMode: "row",
editRowEnded: function (evt, ui) {
if (ui.update || ui.rowAdding) {
// alert('saving');
$("#SecuritySubs").igGrid("saveChanges");
saveChangesErrorHandler: function (jqXHR, textStatus, errorThrown) {
// debugger
$("#message").text("An error occurred while saving the changes. Error details: " + errorThrown);//.fadeIn(3000).fadeOut(5000);
enableDeleteRow: true,
rowEditDialogContainment: "owner",
showReadonlyEditors: false,
enableDataDirtyException: false,
showDoneCancelButtons: true,
columnKey: "IDX",
readOnly: true
columnKey: "BarraModelId",
editorType: "text"
columnKey: "BarraId",
editorType: "text",
columnKey: "AltBarraId",
validation: true,
required: true,
width: "900px",
height: '400px'
//dataSource: subs,
});
I set the grid to use the updateUrl: "Main.aspx/Update". The method signature on the back end is the following.
[System.Web.Services.WebMethod(EnableSession = true)]
public static bool Update()
return true;
The method does not get called. I am calling the saveChanges function but no server method gets called. How do I use updating within aspx.
Thanks,
John
Hello John,
Thank you for the provided information.
I am currently exploring the received configuration.
I will come back with an update as soon as possible.
In the meantime, in case you have additional questions feel free to ask them.
Best Regards
Have you come up with a solution? The only thing I can think to do is execute an $.ajax(...) update request from the editRowEnded event, turn autoCommit to false and control that myself, and get rid of the updateURL property.
Also, A second question. I have hidden fields in the grid that I would like to update when another field is updated. This works ok when we are update existing rows but does not for a new row. I tried updating the ui.values in the editRowEnded event but this does not get reflected in the grid. Do you have a solution for that?
I am sorry for the delay.
Regarding the question about updating the hidden columns you can handle the editRowEnding event. Since the updating isn’t finished you can change the values field of the ui param which would result in change the column value.
For example if you have a column with key “HiddenColumn” and want to set the value after adding new row to “default value”:
editRowEnding: function (evt, ui) {
if(ui.rowAdding) {
ui.values["HiddenColumn"] = "default value";
I have attached a sample showing this solution. You can try to first add row and then show the “HiddenColumn” to show its value.
Regarding the initial matter about SaveChanges:
I still can’t quite figure out why the update method is not called. The grid does make the call but the server side doesn’t seem to handle it. I will continue to investigate the issue.
In the meantime you can try to use manually ajax requests to the server.
I will get back to you with an update of the progress by the end of 03/01/2018.
Kind Regards
UpdateHiddenCellsSample.zip
Currently sending the transactions using the standard saveChanges() method to a WebMethod will not be possible because by default the content is sent as “application/x-www-form-urlencoded” which cannot be handled by a WebMethod.
WebMethods require the Content-Type to be application/json otherwise they will disregard the request.
Since currently there is no option out of the box to set different request options I would suggest that you send the changes manually.
You can get the current transactions via the API:
https://www.igniteui.com/help/api/2018.2/ui.igGrid#methods:transactionsAsString
And send them with an ajax request, for example:
var data = { "ig_transactions": grid.igGrid("transactionsAsString") }; $.ajax({ type: 'POST', url: '<%= ResolveUrl("~/Default.aspx/UpdateData") %>', contentType: 'application/json; charset=utf-8', data: JSON.stringify(data), success: function (msg) { } });
And handle it on the back-end:
[WebMethod] [ScriptMethod(ResponseFormat = ResponseFormat.Json)] public static string UpdateData(string ig_transactions) { … }
You can get the transactions string, de-serialize it and apply it to your backend.
Let me know if that solves your issue.
Best Regards,
Maya Kirova
This solution will be enormously helpful. Thanks. Hows the update stuff coming along.
First step would be to use GET method and get the query string passed in the url. Then filter the remote data depending on the passed keys in the query.
[WebMethod] [ScriptMethod(ResponseFormat = ResponseFormat.Json, UseHttpGet = true)] public static ResponseData GetData() { var queryString = System.Web.HttpContext.Current.Request.QueryString; }
Please note that after filtering has finished you should pass the filtered data as json.
I have linked a sample written in ASPX that has remote features. Feel free to check the implementation here.
These solution target the MVC model. I am using traditional aspx pages. I can see data being passed back from the grid to the server but don't understand how this get translated to an actual function call. This is the request.
POST http://localhost/investWeb/BPM/Main.aspx/GetPortfolioModels HTTP/1.1
Content-Type: application/json; charset=utf-8
Accept: */*
X-Requested-With: XMLHttpRequest
Referer: http://localhost/investWeb/BPM/Main.aspx
Accept-Language: en-US
Accept-Encoding: gzip, deflate
User-Agent: Mozilla/5.0 (Windows NT 10.0; WOW64; Trident/7.0; rv:11.0) like Gecko
Content-Length: 43
DNT: 1
Host: localhost
Connection: Keep-Alive
Pragma: no-cache
Cookie: ASP.NET_SessionId=k1h23uayle1fq3i0ak1vybzd
{"$orderby":"PortfolioName asc","pk":"IDX"}
My current method gets called but how do I get the stuff in the $orderdy. It is not in the Request.QueryString likely because the request is of type XMLHttpRequest. Do you have a method signature that demonstrates this. I am currently trying to get sorting working.
public static AjaxResultSet<Mfs.Invest.InvestData.BPM.PortfolioModel> GetPortfolioModels(object pk) //int pageIndex, int pageSize)
AjaxResultSet<Mfs.Invest.InvestData.BPM.PortfolioModel> data = new AjaxResultSet<Mfs.Invest.InvestData.BPM.PortfolioModel>();
List<Mfs.Invest.InvestData.BPM.PortfolioModel> barraSubs = Mfs.Invest.InvestData.BPM.PortfolioModel.GetModelsForEdit();
data.Items = barraSubs; //.Skip(pageSize * pageIndex).Take(pageSize).ToList();
data.TotalRecordsCount = barraSubs.Count;
return data;
Hello John.
This should be applied in order to have remote features.
https://www.igniteui.com/help/handling-remote-features-manually#filtering
Regarding the first matter I managed to hit the update event on server side using post and passing data as Json. It turns out by default the passed value is not of Json type. I will try to find a better solution but for now you can use custom request and save transactions to the server manualy using Ajax.
I will continue to work on this and come back with an Update on the Progress by the end of the business day on Thuesday (03/05/2019).