issue adding grid column with odata

[Sietse Wielenga]

I'm using the grid with OdataV4-adaptor and facing an issue when adding a column which refers to an expand-field.

btnAddColumn(): void {

  var grid = $("#Grid").ejGrid("instance");

  grid.columns({ field: "status.name", headerText: "Status", width: 150}, "add");
  grid.refreshContent(true);

}

After adding the column the column itself is visible in the grid, but the data for this new column is not, unless the user is doing a hard page-refresh.

It seems that the OdataV4-adaptor isn't notified that after the column is added it should also update the odata-url which is fired by the adaptor:

odata-url in the adaptor:

http://myservice/campaigns

odata-url which is fired by the adaptor before adding the column:

http://myservice/campaigns?$orderby=name

odata-url which is fired by the adaptor after adding the column:

http://myservice/campaigns?$orderby=name

odata-url which is fired by the adaptor after manual hard page-refresh:

http://myservice/campaigns?$expand=status/name&$orderby=name

How to solve this so when adding a column, the adaptor is also notified that it should update the odata-url?

[Sathyanarayanamoorthy Eswararao]

Hi Sietse, 

Thanks for contacting Syncfusion support. 

We have analyzed your query and we suspect that the mentioned issue occurs due to the column details defined as an object in columns method of ejGrid. 

So, we suggest you to pass the column details as an array of object.  

Please refer the below code example. 

   

 

@Html.EJ().Button("Add").Size(ButtonSize.Large).ShowRoundedCorner(true).Text("Add Column").ClientSideEvents(eve => eve.Click("Addcolumn")) 

 

 

 

@(Html.EJ().Grid<object>("Editing") 

                  .Datasource(datasource => datasource.URL("http://services.odata.org/v4/northwind/northwind.svc/Orders").Adaptor(AdaptorType.ODataV4Adaptor)) 

                   

        .Columns(col => 

        { 

            col.Field("OrderID").HeaderText("Order ID").IsPrimaryKey(true).IsIdentity(true).Width(50).Add(); 

            col.Field("EmployeeID").HeaderText("Employee ID").Width(50).Add(); 

            col.Field("ShipCity").HeaderText("ShipCity").Width(50).Add(); 

        }) 

 

) 

 

<script> 

    function Addcolumn() { 

        var obj = $(".e-grid").ejGrid("instance"); 

        obj.columns([{ field: "CustomerID", headerText: "CustomerID", width: 80 }], "add") 

        obj.refreshContent(true); 

    } 

</script> 

Please refer the below link for details of  columns method. 

https://help.syncfusion.com/api/js/ejgrid#methods:columns  

If you need any further assistance please get back to us. 

Regards,
Sathyanarayanamoorthy