Problem:
How to create a custom search with a datepicker which will filter between to date values of custom fields?
Solution:
- Create a view in Classic mode:
https://toolset.com/course-lesson/enabling-legacy-version-of-toolset-views/
- On the Search and Pagination section (If you do not see that section click the Screen Option at the top to enable it)
- Click the New Filter to add a new filter.
- Use the information below:
1. Opening Date for the field
2. Set the data type to UNASSIGNED (because the dates are stored as UNIX timestamp in Toolset)
3. Set the comparison to "Lower than or Equal to".
4. In the Field options section take note of the URL Param as you will use it later.
- Click the New Filter to add this time the closing date with the information below:
1. Closing Date for the field
2. Set the data type to UNASSIGNED (because the dates are stored as UNIX timestamp in Toolset)
3. Set the comparison to "Greater than".
4. In the Field options add the value of the URL param you noted in the previous step.
5. The same URL param for opening and closing date will cause both datepickers take the same value when the customer adds the date.
- In the HTML code of the Closing date is automatically created add a style or CSS code to hide the closing date as the viewer only needs one datepicker and the closing one will automatically get the value of the opening one in the search. So maybe a style="display: none;" will do.
- In the same Search and Pagination section add a submit button using the editor buttons to have a way to submit the date.
- Save the view and use it on a page.
