Adding date picker to column dropdown filter

[rkeverParticipant]

Greetings,

I’ve tried 2 methods to get our column dropdown filter dialog to contain a date range picker and have had no luck with either.
First I tried to use the jqxDateTimeInput (range type) within the column dropdown filter using the build in filtertype option. In a column options I set the {filtertype: ‘range’} and the dropdown filter shows the text input with no datepicker. If I set it to {filtertype: ‘date’} it works which is not what we were aiming for.

Second option was to make a custom filter {filtertype: ‘custom’, createfilterpanel: (datafield, filterPanel) => {/* my custom code */}. I successfully created date range picker that provides the range selector as expected. The issue is that when the range picker shows and I’ve clicked on it, due to the fact it’s rendered outside the dropdown filter, it closes the dropdown filter with the date range selector still visible and of course it then won’t take the selection since the filter has been closed. See http://imgur.com/a/RqjPU for example. clicking in the green area closes the dialog but leaves the picker still visible.

Is there some way to force the dropdown filter dialog to stay open until I programmatically tell it to close?

Thanks,

~~~Robert

[HristoParticipant]

Hello Robert,

I would like to suggest you look at this example:
http://www.jqwidgets.com/jquery-widgets-demo/demos/jqxgrid/filterrow.htm?light

Unfortunately, it is not possible to prevent this close action.
I also would suggest you to create a jqxDateTimeInput (with range selection) outside of the Grid as a workaround.

Best Regards,
Hristo Hristov

jQWidgets team
http://www.jqwidgets.com

[rkeverParticipant]

Thanks Hristo for speedy reply.

I’d like to clearify one question I had about filtertype (dropdown filter feature for individual column). As I Had mentioned before, you allow for filtertype=”date”. If you guys are already using the jqxDateTimeInput class to build out the picker with option filter=”date” can we request you add the option for filter=”range” for a future release? This would be a huge asset for many of our projects used inside our company.

I was trying to avoid that simply due to the fact our columns widths can be adjusted by the user but if there’s no other way I suppose we’ll have to downgrade our requirements.

Thanks,

~~~Robert

[HristoParticipant]

Hello Robert,

We have such demo. Please, take a look this demo:
http://www.jqwidgets.com/jquery-widgets-demo/demos/jqxgrid/filterrow.htm?light
(The ‘Ship Date’ column is filtered by type ‘range’)

Best Regards,
Hristo Hristov

jQWidgets team
http://www.jqwidgets.com

[Author]

Posts