How to Use Advanced Date Picker in Data Grid 2 Date Filter

0
We use the Advanced Date Picker throughout our application to maintain a consistent date selection UI and user experience.However, Data Grid 2 uses its default Date Filter widget, which differs from the Advanced Date Picker used elsewhere in our application.Could you please advise whether it is possible to replace the default Date Filter widget in Data Grid 2 with the Advanced Date Picker?If this is possible, please share the recommended approach or configuration steps to achieve this. If direct replacement is not supported, could you suggest an alternative or workaround to use the Advanced Date Picker for filtering Data Grid 2 records?Thank you for your guidance and support.
asked
3 answers
0

Hi Saravanan,


The Advanced Date Picker cannot directly replace the Data Grid 2 Date Filter. Data Grid 2 filter widgets have specific integration with the grid datasource and filtering mechanism, so a normal date picker does not automatically act as a grid filter.

A possible workaround is to place the Advanced Date Picker outside the grid and bind it to a helper object/date attribute. Then use that value as part of the Data Grid 2 datasource filtering logic, for example through a microflow datasource. The downside is that you would need to handle refreshing/reloading the grid when the date changes.

Another option, if the main requirement is UI consistency, would be to customize the styling of the standard Data Grid 2 Date Filter so that it visually matches the Advanced Date Picker as closely as possible.

So in short, direct replacement is not supported, but using a helper date attribute with custom datasource filtering would be the closest workaround.

I hope this helps

answered
0

Hi Saravanan,


The standard Date Filter in Data Grid 2 cannot be directly replaced with the Advanced Date Picker because they serve different purposes. The Date Filter integrates with Data Grid 2's built-in filtering mechanism, whereas the Advanced Date Picker is a date-selection widget.

You have two practical options:


Option 1: Use the Advanced Date Picker with a custom filtering flow

If you want to maintain the same date-selection UI across your application:

  1. Create a non-persistable helper entity with the required date attributes.
  2. Bind the Advanced Date Picker to the helper entity's date attribute.
  3. Use its change event to trigger a microflow or nanoflow.
  4. Apply the selected date or date range to your filtering logic.
  5. Refresh the grid with the filtered results.

For this approach, a microflow-based Data Grid 2 data source can retrieve records based on the selected dates. You will need to implement the filtering logic yourself rather than relying on the standard Date Filter.


Option 2: Create a custom Data Grid 2 filter widget

If you want the Advanced Date Picker to behave exactly like the built-in Date Filter—including integrating with Data Grid 2's filtering and refresh behavior—you would need a custom widget that implements the appropriate Data Grid 2 filter integration.


My recommendation: Start with Option 1 if you want to reuse the Advanced Date Picker without developing a custom widget. If you need to preserve all the standard Data Grid 2 filtering behavior, investigate Option 2.


The key point is that changing the date-picker UI alone will not automatically connect it to Data Grid 2's filtering mechanism.

For reference:


Hope this helps.

answered
0

Hi Saravanan,

As per you ask here is the solution I would sugget,


1. Can the default Date Filter in a Data Grid 2 column be replaced with the Advanced Date Picker?

Not directly. Data Grid 2 filters out of the box only with its own filter widgets (Text, Number, Date and Drop-down filter from Data Widgets). The Advanced Date Picker isn’t connected to the grid’s filtering, so dropping it into the column header won’t filter anything by itself.

You can still get the same result with a workaround. The Advanced Date Picker captures the date on a helper object, and the grid’s data source filters the records based on that value.


2. How to set it up

Step 1 – Create a helper entity

Create a non-persistent entity, e.g. HelperEntity, with two attributes:

  • StartDate (Date and time)
  • EndDate (Date and time), only needed if you want range filtering


Step 2 – Wrap the grid in a data view with the helper object

  • Add a data view around the Data Grid 2, with a microflow data source (e.g. DS_CreateDatePickerHelper) that creates and returns a new HelperEntity object.
  • Set the Data Grid 2 data source to a microflow (e.g. DS_GetDepartmentObject) that takes HelperEntity as its parameter.
  • In the column header where the default Date Filter would go (here, the test4 column), place the Advanced Date Picker instead.


Step 3 – Configure the Advanced Date Picker

On the General tab:

  • Selection type: Single, or Range if you want a start and end date
  • Date attribute: HelperEntity/StartDate (plus EndDate for a range)


Step 4 – Add an On change event to refresh the grid

On the Events tab, set On change to call a microflow (e.g. OCH_RefreshData). The microflow takes HelperEntity as a parameter and has a single Change object activity on it with Refresh in client = Yes and no member changes. Refreshing the helper object makes the grid’s microflow data source run again with the newly selected date.


Step 5 – Filter the records in the data source microflow

In DS_GetDepartmentObject:

  1. Retrieve the list of DepartmentMaster objects from the database.
  2. Add a decision that checks whether a date was selected: $HelperEntity/StartDate != empty.
    • false: return the full list.
    • true: apply a List operation → Filter by expression and return the filtered list.


The filter expression compares only the date part, ignoring time:


parseDateTime(formatDateTime($currentObject/test4, 'dd/MM/yyyy 00:00:00.000'), 'dd/MM/yyyy 00:00:00.000')
=
parseDateTime(formatDateTime($HelperEntity/StartDate, 'dd/MM/yyyy 00:00:00.000'), 'dd/MM/yyyy 00:00:00.000')


A simpler equivalent uses trimToDays:


trimToDays($currentObject/test4) = trimToDays($HelperEntity/StartDate)

For a date range (Selection type = Range):


$currentObject/test4 >= trimToDays($HelperEntity/StartDate)
and
$currentObject/test4 < addDays(trimToDays($HelperEntity/EndDate), 1)


Things to keep in mind

  • Performance: this approach retrieves all records and then filters them in memory. That’s fine for small or medium tables. For large tables, put the date condition directly in the Retrieve activity’s XPath constraint, e.g. [test4 >= $StartOfDay and test4 < $EndOfDay], so the database does the filtering.
  • Clearing the filter: add a “Clear” button that empties StartDate and EndDate and refreshes the helper, so all records show again.
  • Other columns: the other columns can keep using the standard Data Grid 2 filters (Text, Drop-down, and so on) alongside this setup.


Hope this helps. If you have any doubt on this process, feel free to connect.


If this solution works for you, kindly mark it as the accepted answer so it can help others facing the same issue.



Placed Advanced Date Picker on datagrid2


Configure the Helper Attribute On Advanced Date picker


On changed MF or NF


Refresh The parameter placed on the DS of Dategrid2


Filter Logi on DS of datagrid 2


answered