We have a grid column that is display date in M/DD/YYYY format. The Data set for this date column includes a time value. When the user groups by this column the grouping is including the time so there are many groups for the same date. Is there a way to tell the grid to ignore the time for the grouping? I would have assumed it would grouped based on the format displayed to the user but its not working that way.
Hello Tammy,
Let me explain why this is the case.
The GroupBy is a data operation (data operations like GroupBy, Sorting, Filtering and Paging) that's executed at igDataSource level so it's not affected by the formatting (formatting is done before displaying the data) which is done on igGrid level. Currently we don't have formatting capabilities in igDataSource, that's why what you expect is not currently available out of the box.
To cover your scenario we expose an option igGridGroupBy.columnSettings.compareFunc that you need to set with custom logic.
Here's a sample implementation that compares only the dates:
features: [
{
name: "GroupBy",
columnSettings: [
columnKey: "SellStartDate",
compareFunc: function(val1, val2, recordsData) {
var d1 = new Date(val1), d2 = new Date(val2);
return d1.getYear() === d2.getYear()
&& d1.getMonth() === d2.getMonth()
&& d1.getDay() === d2.getDay();
}
]
Best regards, Martin Pavlov
Infragistics, Inc.
I am sure i'm missing something obvious but I can't get it to work with our MVC wrapper. Here's how I set it up. Thoughts?
groupByWrapper.Type(isLocal ? OpType.Local : OpType.Remote).ColumnSettings(groupedColumn => { foreach (ScreenControlGridColumns groupByColumn in gridGroupByColumns) groupedColumn.ColumnSetting().ColumnKey(groupByColumn.FieldName).IsGroupBy(true);
groupedColumn.ColumnSetting().ColumnKey("SCHEDULED_SHIP_DATE") .CompareFunc("_webUi.Grid.gridCompareDateFunc(val1,val2,recordData)"); });
In JavaScript is the function you gave me....
gridCompareDateFunc: function (val1, val2, recordsData) { debugger; var d1 = new Date(val1), d2 = new Date(val2); return d1.getYear() === d2.getYear() && d1.getMonth() === d2.getMonth() && d1.getDay() === d2.getDay(); },
I think I was able to replicate what you're talking about. The data should be pre-sorted for this function to work. Unfortunately my sample has data source with pre-sorted data for date columns. I'll investigate why the data is not sorted as part of the customFunction execution. Will update you when I have more information.
Best regards, Martin Pavlov Infragistics, Inc.
Ok this customer reported so please keep me in the loop.
If you can confirm that the custom function is executed when grouping, could you please try changing it with the following code:
gridCompareDateFunc: function (val1, val2, recordsData) { var d1 = new Date(val1), d2 = new Date(val2); if (d1.getYear() === d2.getYear() && d1.getMonth() === d2.getMonth() && d1.getDay() === d2.getDay()) { return 0; } return Math.sign(val1 - val2);}
I hope this helps!
Best regards,
Stamen Stoychev
I can't get it to trigger. I set it up similar to the column FormatterFunction and couldn't get it to work that way either. I don't know if its not triggering because we're using MVC or because we're using remote instead of local. I need more guidance.
I'm attaching a MVC sample with remote GroupBy. The compareFunc is attached to the "window" object in order to trigger.
Best regards, Martin Pavlov Infragistics, Inc.igGrid_Sample_MVC5.zip
I've opened a private case with #CAS-190782-J7J3R5 on your behalf. Let's continue there.
We have that all setup our paging, etc is working fine. If it's easier we can arrange a call. I can send you the exact grid parameters if we switch this to a private case.
Actually, you won't need to implement the compare function server-side. I was wrong in my previous reply. After playing around with this a little bit more I think this could be because you haven't configured DataSourceUrl for your grid. Without it the grid will assume that it is bound locally and remote operations will fail.
You need something like this in your setup:
model.DataSourceUrl = Url.Action("GetData");
or if you are using the wrappers
...
.DataSourceUrl(Url.Action("GetData"))
And a corresponding action. For example:
[GridDataSourceAction] public ActionResult GetData() { return View(Product.GetProductData().AsQueryable()); }
When grouping, the sort portion will be executed on the server then when the data is sorted it'll be taken over by the custom function on the client.
If this still doesn't work and you can't provide a sample that I can look at, please let me know so we can arrange a call through a private support case.
It's remote group by
Defining the grid in the controller should not affect the end result. I modified Martin's sample to confirm. I am attaching it for your reference.
Are you sure that you are using local GroupBy? In your code you specify it like this:
groupByWrapper.Type(isLocal ? OpType.Local : OpType.Remote)
If you are using remote GroupBy, the solution will be server-side, however, you will also have to do all remote operations manually then as you won't be able to take advantage of the GridDataSourceAction attribute to let the MVC wrappers do them for you.
Let me know if this is the case, so I can help you with a server-side implementation of the requirements.
5633.igGrid_Sample_MVC5.zip