Your Privacy Matters: We use our own and third-party cookies to improve your experience on our website. By continuing to use the website we understand that you accept their use. Cookie Policy
60
Can I call an asynchronous post request in a formatterfunction of a grid in MVC ?
posted

Using igniteui version 17.2 with ASP.NET MVC 5 application:

my simplified grid in cshtml file:

@(Html.Infragistics().Grid(Model.Records).ID("masterGrid").AutoGenerateColumns(false).Width("99%")
.RenderCheckboxes(true).LocalSchemaTransform(true)
.AutoGenerateLayouts(true)
.PrimaryKey("Bonnr")
.ResponseDataKey("Records")
.Virtualization(false)
.FixedHeaders(true)
.ShowHeader(true)
.AutoAdjustHeight(true)
.Columns(column =>
{
column.For(x => x.Bonnr).HeaderText("Bon").DataType("number");
column.For(x => x.MoederOrderNr).HeaderText("Order").FormatterFunction("formatBackOrderNr");})
.DataBind().Render()
)

my function in javascript file

function formatBackOrderNr(val, row) {
var txtUrl = "<div>&emsp;&emsp;</div>";
if (row.MoederOrderNr !== 0) {
$.ajax({
url: UrlSettings.CheckIsBestellingUrl,
type: 'post',
data: {
ordernr: row.MoederOrderNr
},
success: function (result) {
console.log(row.MoederOrderNr); // <== THE OUPUT IS CORRECT
if (result === true) {
var url = UrlSettings.MoederOrderUrl + '/O' + row.MoederOrderNr;
txtUrl = "<a class='backorder' href='" + url + "'>" + row.MoederOrderNr + "</a>";
} else {
txtUrl = "<div>" + row.MoederOrderNr + "</div>";
}
},
async: false // <== THIS WORKS !
});
}
return txtUrl;
}

If I use async: true // <== THIS DOES NOT WORK - column is empty !

Some observations:

The grid is rendered without errors except for the defined column being empty (when async: true).
If I use 'async false' in my post request, the grid is rendered AFTER all my console.log statements.
If I use 'async true' in my post request, the grid is rendered somewhere IN BETWEEN the console.log statements.
I do get a deprecation warning in the console of Chrome if I use async false.
I also see my console.log output in the formattter function 'on success' correctly whether I use async true or false.

Any suggestions on how to solve this with async true ?

thx,

  • 23953
    Offline posted

    Hello Peter,

     

    I'm afraid that's not possible. The formatter function gets executed on grid rendering time and it's expected to return result synchronously.

    Your option is to asynchronously execute all the requests for the cells and call igGridUpdating.setCellValue API for each request once done. For this to work you need to enable Updating feature and disable its end-user editing capabilities if you don't need them.

     

    Best regards,
    Martin Pavlov
    Infragistics, Inc.