Chart Range using Dropdown List

The operators for one of my clients, want to be able to quick select different ranges on their charts via drop down list, then fine tune using the bar at the bottom afterwards.

So far i have a dropdown list, but i dont seem to be able to get it working as i intend.

Any ideas?

This is probably easiest to explain with an example. In the attached, I use two invisible columns of the data property of the dropdown to hold a startdate and enddate. The startdate and enddate values are bound with a cell update binding to some custom properties on the dropdown component - these custom properties are driven by expressions. Then, on the date range component I put on the bottom half of the window, I bound the start date and end date properties to the dropdown’s dataset, using the rowIndex and a static column index. I wrapped it all in a try() so that, when the window first loads, if no value is selected on the dropdown the end user won’t see any nasty errors/overlays.

Sometimes binding can end up quite involved - in this case I think coding directly is actually easier.

To do this, set up a dropdown with the following static data:

Value Label 1 Last 24 hours 3 Last 3 days 7 Last 7 daysThen attach the following code to the dropdown’s propertyChange event:

if event.propertyName == 'selectedValue' and event.newValue > -1: days = event.newValue endDate = startDate =, -days) dateRange = event.source.parent.getComponent('Date Range') dateRange.startDate = startDate dateRange.endDate = endDate
This code checks to make sure the user has selected a valid entry from the list before calculating the start and end times and writing them directly to the date range control.

I’ve attached a project to show how this is done. Just right-click on the Windows entry in the Project Browser and select import to try this out.

1 Like