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.
Unfortunately, activation email could not send to your email. Please try again.

Grid filter not working on dynamically added columns

Thread ID:

Created:

Updated:

Platform:

Replies:

128646 Feb 2,2017 08:18 AM Mar 23,2018 02:59 AM ASP.NET MVC 5
loading
Tags: Grid
Jeffrey Stone
Asked On February 2, 2017 08:18 AM

I am using a grid which has approximately 20 columns.

Depending upon what the user is viewing there are some dynamic columns - which I either add or remove using the following:

The problem I am having is that the Excel Filter does not work for the newly added fields.

Here is the basic flow of the request:

// this function is called when the new data needs to be displayed in the grid
function loadBacktestGroupBacktestResults(id, backtestResultId) {
        // go get the dynamic columns
        $.ajax({
            type: "GET",
            dataType: "json",
            url: settings.getAdditionalFieldsUrl,
            data: {
                type: "backtestResult",
                id: id
            },

            success: function(result) {
                var gridElement = settings.$backtestResultGrid;
                var gridInstance = gridElement.ejGrid("instance");
                var parameters = { type: "backtestResult", id: backtestResultId, numberOfTopResults: 0 }
                var query = new ej.Query().addParams();

                $.each(parameters,
                    function(key, value) {
                        query.addParams(key, value);
                    });

                gridElement.ejGrid({ query: query });

                // I have simplified the next few lines of code for this example to show at a high level what the logic does
                var fieldsToAdd = [ { field: "fieldName1", allowEditing: false, headerText: "Dynamic Field 1" }, { field: "fieldName2", allowEditing: false, headerText: "Dynamic Field 2" } ];
                var fieldsToRemove = // gets an array of column names to remove
                if (fieldsToAdd.length > 0 || fieldsToRemove.length > 0)  {
                    gridInstance.columns(fieldsToAdd, "add");
                    gridInstance.columns(fieldsToRemove, "remove");
                    // updating the fields will cause an update in the datasource so we don't need to refresh the content
                }
                else {
                    // refresh the grid content will will use the new parameters
                    gridInstance.refreshContent();
                }
            }
        });

Here is the definition of the grid

@(Html.EJ().Grid<BacktestResultRow>("BacktestResultGrid")
      .Datasource(ds => ds.URL(Url.BacktestResultsBatchDataSource()).BatchURL(Url.BacktestResultsBatchUpdate()).Adaptor(AdaptorType.UrlAdaptor))
      .Query("new ej.Query().addParams('type','').addParams('id','0').addParams('numberOfTopResults','0')")
      .EditSettings(edit => { edit.AllowEditing().EditMode(EditMode.Batch); })
      .AllowFiltering()
      .AllowPaging()
      .AllowResizeToFit()
      .AllowSelection()
      .AllowScrolling()
      .AllowSorting()
      .AllowTextWrap()
      .FilterSettings(filter => { filter.FilterType(FilterType.Excel); })
      .IsResponsive()
      .MinWidth(250)
      .PageSettings(pg => pg.PageSize(10))
      .SelectionType(SelectionType.Multiple)
      .ScrollSettings(col => { col.Width("auto").Height("auto"); })
      .ShowColumnChooser()


Thanks, Jeff

Prasanna Kumar Viswanathan [Syncfusion]
Replied On February 3, 2017 08:04 AM

Hi Jeffrey, 

Thanks for contacting Syncfusion support. 

We checked in our sample by adding new columns in a button click using columns method.  In our sample the Excel filter is working fine for the newly added fields.  

To find out the root cause we need the following details, 

1. Have you face any script error when you click on the excel filter icon for the newly added fields? If yes, Share the screenshot and stackrace of an issue. 

2. Is the filter dialog open for the newly added fields?  

3. Essential Studio Version details. 

4. If possible, replicate the issue in the attached sample.  

Find the code example and sample:  


<button id="button" onclick="column()">Columns</button> 
 
@(Html.EJ().Grid<object>("FlatGrid") 
   .Datasource(d => d.URL("/Home/GetData").BatchURL("/Home/BatchUpdate").Adaptor(AdaptorType.UrlAdaptor)) 
   .EditSettings(edit => edit.AllowEditing().EditMode(EditMode.Batch)) 
   ----------------------------------------- 
 .Columns(col => 
  { 
       ----------------------------------- 
  }) 
    
 ) 
 
 
<script type="text/javascript"> 
    function column() { 
        var grid = $("#FlatGrid").ejGrid("instance"); 
        var fieldsToAdd = [{ field: "CustomerID", allowEditing: false, headerText: "Customer ID" }, { field: "EmployeeID", allowEditing: false, headerText: "Employee ID" }]; 
        if (fieldsToAdd.length > 0) { 
            grid.columns(fieldsToAdd, "add"); 
             
        } 
    } 
</script> 

 


Note : There are two scenarios that the Excel Filter does not work for the newly added fields. 

1. If you add a new type column to grid dynamically. i.e., if the initially defined columns doesn’t have a string type and if you dynamically add a string type column, script error thrown on clicking the filter icon. 
 
2. If the newly added column has a null value as first record, then we unable to open the filter dialog for the newly added fields.  
 
If you facing the issue with above scenarios, please get back to us.  

Regards, 
Prasanna Kumar N.S.V 


Chris
Replied On March 21, 2018 06:21 PM

I am facing a very similar scenario except that I am using ASP.Net Core. 

I went into the database and edited it so that the newly added field for the first record is not null and then it worked.  How can I get this to work if the first record has a null value?

Thanks,
Chris

Vignesh Natarajan [Syncfusion]
Replied On March 22, 2018 10:31 AM

Hi Chris, 

Thanks for using Syncfusion products. 

Query: “ How can I get this to work if the first record has a null value” 

We have analyzed your query and we suspect that you want to filter the newly added/generated column when the first record value is null. We suggest you to give type property to the newly added column. This will help in filter the records when value is null. 

Refer the Knowledge base document for your reference. This knowledge base document explain how the column type is set base on its first record. So when first record value is null, column type is not set so filtering cannot be performed. 


Refer the help documentation for your reference 



Regards, 
Vignesh Natarajan 




Chris
Replied On March 22, 2018 10:54 AM

Perfect, that worked. 

Thank you.

Chris

Vignesh Natarajan [Syncfusion]
Replied On March 23, 2018 02:59 AM

Hi Chris, 

Thanks for the update. 

We are glad to hear that your query has been resolved by our solution. 

Please get back to us if you have further queries. 

Regards, 
Vignesh Natarajan 



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.

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.

;