How to set up date range URL parameters using deep links

Hi Retool team,

I have difficulty setting up the date range URL parameters using deep linking.

I set up the date range URL parameters (see image). The date range is passed from a module (SearchBar) datepicker.
The URL looks like, for example, https://yourdomain.tryretool.com/presentation/UsersDashboard#EndDate=2021-07-29&StartDate=2021-07-28. But when I copied the URL and pasted it to a new page, the StartDate parameter disappears https://yourdomain.tryretool.com/presentation/UsersDashboard#EndDate=2021-07-29&StartDate=.

How should I set up the date range parameter correctly? Thank you for the help :smiley:

Hey Doris! To make sure I'm following, the EndDate is present but the StartDate disappears? Are there any other differences between the two in your app setup?

Hi @victoria,

Thank you for the reply. There is no difference between the two parameters setup.

The date range component is from a module. Here are the screenshots of the StartDate and EndDate setup.
CleanShot 2021-07-31 at 00.13.47
CleanShot 2021-07-31 at 00.17.10

And here is the screenshot of StartDate and EndDate values updated when the user selected 07/28/2021 and 07/29/2021 to be the date range.
CleanShot 2021-07-31 at 00.15.02

Hmm, okay! Then I think the easiest way to debug this would be for me to step into your app to take a look at your setup and then get back to you in this thread for visibility (if any other users are running into this same issue). Would that be alright with you?

Hi @victoria,

Thank you for offering the help. I did some experiments using the Retool dataset and reduced the URL parameters to only the date range start and end value, but the same issue occurred.
It is a simple APP. I think it may be easier for you to replicate it and debug the issue. Hope that's okay.

Replication Steps

  1. Create a query to filter orders table by created_at of which values are selected by the daterangepicker.
  2. Set up the URL parameters: StartDate and EndDate
  3. In the preview mode, select 2018-12-01 and 2018-12-02 as the StartDate and EndDate in daterangepicker. The data should be loaded correctly to the table.
  4. Copy and paste the URL to a new page.




Expected Result
When reopening the URL, the URL should have the correct selected StartDate and EndDate parameters.

Actual Result
When reopening the URL, the StartDate parameter value disappears.

Thank you so much for the help!

Aha! We were able to repro this on our end. Thank you so much for all your patience and helpful explanations.

I'm not sure of the specific cause of the bug yet, but once I can pinpoint it a little further, I'll create a bug report and share this with eng.

In the meantime, would it work if you could set the default start value (in the right panel) to {{urlparams.hash.StartDate}} ? It seems to be working for me!



Hi @victoria,

Thank you for spending time examining the problem. Much appreciated!
I implemented the solution and it works. But it only works if the date range component is set in the same application and is not working if the component is created in a module and imported to the application.

Thank you.

Hi @victoria,

I seem to be facing the exact same issue but the workaround of defaulting the temporary state variable to the value of the hash but it doesn't work. It is still being removed from the hash. Any tips?

Hey Lewenhaupt, can you share the way that you have this set up? I believe the workaround was to have the Start value of the DatePicker linked to the url hash params. But happy to help you troubleshoot!

I'm not using it for a DatePicker but for a temporary state variable and setting the Start value of that to the url hash param. But it doesn't work.

Would you mind sharing your set up? I can share what I have that is working.
App A setting hash params:

App B using those params in Temp State:\

Hash param set when moving from App A to App B\

App B using the value of hash params to set temp state and value of the text component.

Let me know how your setup differs or if you are trying to achieve something else.