Manage filter query parameters with push state
This commit modifies the current page’s URL through the pushState
and
replaceState
API.
When a filter is selected, modify the current URL’s
searchParams
, setting the ?maximum=
query parameter
when there is a filter, and removing it when the form is cleared.
This progressively enhances the page’s experience for those with
JavaScript enabled. Without JavaScript enabled, clicking the <form>
element’s <input type="submit">
element wrapped in a <noscript>
element will be behave similarly.
Most importantly, when the user refreshes the page, the URL will preserve their filtering selections, and the page will render highlighting only the seats within the selected filter.
Within the context of the rest of this example application, this is a somewhat extreme and superfluous client-side enhancement. We’re hewing close to re-implementing server-side logic.
What’s worth highlighting is that we’re thinking in terms of URLs and page reloads, it just so happens that we have an opportunity to improve the performance and experience in a JavaScript-capable environment.