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: November 16, 2018).
Unfortunately, activation email could not send to your email. Please try again.
Syncfusion Feedback

Exposure Count/Column Issue

Thread ID:





130977 Jun 14,2017 10:19 AM UTC Jun 20,2017 12:27 PM UTC ASP.NET MVC 7
Tags: Grid
Frankie Moran
Asked On June 14, 2017 10:19 AM UTC

Hi there,

Needing a bit of help with the Grid MVC.

We have a grid which renders a column called 'Exposure' which has a template on it, where if the Exposure is <= 5 it displays a div, >= 6 and <=12 a different div, and > 12 a different div. These divs look like these:

Just before the grid we have an Exposure Count which counts all the colour ranges. (green 0-5, orange 6-12, and red >12) and displays these like this:

I am using Javascript to loop through the number of rows and calculate the totals for red, orange, and green by using

The first issue is that it only shows the the totals of the first pages data, rather than the first page and second page's totals. I would use .Datasource but if the user filters any of the columns then it will still display the total number in the datasource rather than the filtered data. I also need the totals to be added when the columns. Basically the exposure count should match what the number of items on the grid, i.e. Red (3), Orange (9), Green (7) would match 19 items on the bottom of the grid.

Is there any way of doing this?


Farveen Sulthana Thameeztheen Basha [Syncfusion]
Replied On June 15, 2017 12:51 PM UTC

Hi Frankie, 

Thanks for contacting syncfusion support. 

We have analyzed your query and according to your requirement we have used the template column bound with different colors based on condition. If you want to perform  filtering operation on Template column, you need to define the “field” property for that particular column. Because in Grid, these operations are performed based on the field name.  
If you want to get the filtered records, you can use the getFilteredRecords method in the Grid. By using “ej.sum” you can get the sum of the respective Column by giving its fieldname as like below. Whereas when you sum the datasource it will display the total sum of the EmployeeID column. 
Please refer to the API and code example:- 
<input type="button" value="getFilteredRecords" id="getFilterrecords" /> 
        .PageSettings(page => page.PageSize(7)) 
        .Columns(col => 
            col.Field("EmployeeID").HeaderText("Template Column").Template("#columnTemplate").Width(100).Add(); 
            .  .  . 
     <script type="text/x-jsrender" id="columnTemplate">  
            {{if EmployeeID > 4}}  
            <span class="label label-warning">{{:EmployeeID}}</span>  
            <span class="label label-success">{{:EmployeeID}}</span>  
               text: "getFilteredRecords", click: function () { 
                   var obj = $("#FlatGrid").ejGrid("instance") 
                   Filterdata = ej.sum(obj.getFilteredRecords(), "EmployeeID"); //For Filtered records 
                   datasource = ej.sum(obj.model.dataSource, "EmployeeID")   // For whole datasource 
Refer to the sample:- 


Farveen sulthana T 

Frankie Moran
Replied On June 15, 2017 01:22 PM UTC

Hi Farveen,

Thank you for your response. I have managed to get this working now! 

I have another question which is related to this scenario. 

Would it be possible to filter this column like this? 

So green would show you Exposures <= 5, orange would show you >= 6 and <=12, and red would show you exposures >= 13? 

Currently we are using the Excel type filter

Let me know if this would be possible


Prasanna Kumar Viswanathan [Syncfusion]
Replied On June 16, 2017 10:32 AM UTC

Hi Frankie, 

To achieve your requirement, use filteredColumns property and refreshContent method of ejGrid. In change event of dropdown we check the condition of text and update the filtercolumn details in the filteredColumns property. Once we update the filtercolumn details we call the refreshContent method to get the filtered data in Grid.  

Find the code example and sample : 

@Html.EJ().DropDownList("selectCar").TargetID("carsList").Width("300").WatermarkText("Select a Car").ClientSideEvents(e => e.Change("drpvaluechange")) 
<div id="carsList"> 
<br /> 
                // .Datasource(ds => ds.Json((IEnumerable<object>)ViewBag.dataSource).UpdateURL("CellEditUpdate").InsertURL("CellEditInsert").RemoveURL("CellEditDelete").Adaptor(AdaptorType.RemoteSaveAdaptor)) 
    function drpvaluechange(args) { 
        var grid = $("#FlatGrid").ejGrid("instance"); 
        if (args.text == "Green") { 
            grid.model.filterSettings.filteredColumns = [{ field: "EmployeeID", operator: "lessthanorequal", value: "5", predicate: "and", matchcase: true }]; 
        else if (args.text == "Red") { 
            grid.model.filterSettings.filteredColumns = [{ field: "EmployeeID", operator: "greaterthanorequal", value: "13", predicate: "and", matchcase: true }]; 
        else if (args.text == "Orange") { 
            grid.model.filterSettings.filteredColumns = [{ field: "EmployeeID", operator: "greaterthanorequal", value: "6", predicate: "and", matchcase: true }, { field: "EmployeeID", operator: "lessthanorequal", value: "12", predicate: "and", matchcase: true }];           

Refer to the Help documents.  

Prasanna Kumar N.S.V 

Frankie Moran
Replied On June 16, 2017 12:34 PM UTC

Hi Prasanna,

Is there anyway to put this filter inside the excel filter type, in the items bit? 

So instead of 1-6, it would show Green, Orange, and Red where the relevant colour would show the relevant range of number range? i.e. Green <= 5, Orange >=6 AND <= 12, Red >=13


Prasanna Kumar Viswanathan [Syncfusion]
Replied On June 19, 2017 12:57 PM UTC

Hi Frankie, 

We can put the values as Green, Orange and Red inside the excel filter for the respective values. But in our current implementation of excel filter, it is not feasible to perform filter operation with that values. So, it can be achieved externally. Using headerTemplate feature we render the excel filter icon in the column header. When we click the filter icon it open the dropdownlist with the respective values(Green, Orange and Red). When we select value from the dropdownlist it will perform the filter operation. So, if you need a sample with this please update us.  

Prasanna Kumar N.S.V 

Frankie Moran
Replied On June 19, 2017 01:21 PM UTC

Hi Prasanna,

Could you provide me with a sample for that or code listing to show me how this could be accomplished! 

Thanks again,

Prasanna Kumar Viswanathan [Syncfusion]
Replied On June 20, 2017 12:27 PM UTC

Hi Frankie, 

We consider your requirement as a custom sample and a support incident has been created under your account to track the status of this requirement. Please log on to our support website to check for further updates 

Prasanna Kumar N.S.V 


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.

Please sign in to access our forum

This page will automatically be redirected to the sign-in page in 10 seconds.

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