We use cookies to give you the best experience on our website. If you continue to browse, then you agree to our privacy policy and cookie policy. (Last updated on : Nov 16th 2018).
Unfortunately, activation email could not send to your email. Please try again.
Syncfusion Feedback

Refreshing grid after adding columns

Thread ID:

Created:

Updated:

Platform:

Replies:

132490 Sep 5,2017 09:17 AM UTC Sep 6,2017 06:15 AM UTC Angular 1
loading
Tags: ejGrid
Dina Abdelbary
Asked On September 5, 2017 09:17 AM UTC

Hi,

I m using a dynnamic ejGrid, which i add its columns at ngAfterViewInit(), and sets it datasource after pressing Search button.

"
ngAfterViewInit(){
 var obj = $("#webReportGrid").ejGrid("instance");

    this.myService.getWebReportInfo(this.reportId).subscribe(
      data => {
        var columns = data.userViewColumns;
        var gridColumns;
        for (var i = 0; i < columns.length; i++) {
          var newColumn = { field: columns[i].field, headerText: columns[i].name, width: 100, textAlign: "center" }
          gridColumns = obj.model.columns.push(newColumn);
        }
      },
      err => console.error(err),
      () => console.log('done getting report info')
    );
  
     this.gridData=[];
}


search()
{
 this.gridData=[];//here the columns is appeared at UI
}


The issue is that after adding the columns to grid, it does not appear, it appears only after pressing the button and set the datasource, if i set it after adding the columns at ngAfterViewInit() it does not appear, 

kindly let me know what to do to make the grid appears with its columns to the user, before search  button is pressed.

Regards


Seeni Sakthi Kumar Seeni Raj [Syncfusion]
Replied On September 6, 2017 06:15 AM UTC

Hi Dina,  
 
Thanks for contacting Syncfusion Support.  
 
We are not aware of the code example that you are trying to update the Grid columns. However, we suspect that you are pushing the new columns in the Grid Model and not refreshing the Grid. So, we suggest to use the following scenarios.  
 
  1. Update Grid Columns using the columns method
 
Refer to the following code example and API References.  
 
 
    var cols = []; 
    cols.push({ field: "EmployeeID" }); 
    cols.push({ field: "CustomerID" }); 
    $("#Grid").ejGrid("columns", cols, "add"); 
 
 
 
 
  1. Pushing Grid columns and Refreshing the Content
 
Refer to the following code example and API Reference for the refreshContent method. 
 
    var obj = $("#Grid").ejGrid("instance"); 
     
    obj.model.columns.push({ field: "CustomerID" }); 
    obj.model.columns.push({ field: "EmployeeID" }); 
    obj.refreshContent(true); 
 
 
If you are still facing any problem, please share the following details to analyze the problem at our end.  
 
  1. Complete code example of the column update along with the Grid
  2. Screenshot or video demo of the issue
 
Regards,  
Seeni Sakthi Kumar S. 
 


CONFIRMATION

This post will be permanently deleted. Are you sure you want to continue?

Sorry, An error occured while processing your request. Please try again later.

Warning Icon You are using an outdated version of Internet Explorer that may not display all features of this and other websites. Upgrade to Internet Explorer 8 or newer for a better experience.Close Icon

;