Persisting select box selections across routes without saving records to the database

Learning Team
1

Hi, I’m trying to persist some data in the URL because I don’t want to save to the database. Please can i get some feedback on my method?

<!-- On /language -->

<select>
	<option value="slug1">text1</option>
	<option value="slug2">text2</option>
	<option value="slug3">text3</option>
	<option value="slug4">text4</option>
</select>

<!-- on submit transitions to -->

/language/<slug1>

<!-- hitting the above redirects to -->

/language/<slug1>/signups/new
<!--
slug is only persisted in the URL to
enable me to do a lookup on the language
model to return text for the signup form.
The language is not persisted to the DB
-->

The problem i’m having is I want to persist the slug selection across routes without saving any data to the database and have taken a nested routes approach to this so I can collect the slug from the URL to do the query and use the data returned in the signups template. I don’t want to nest the templates, however.

I’m a bit confused as to wether this isn’t the ember way and if not, would would one persist a selection so that it’s value can be used later down the line?

Thanks in advance for any help!

2

There are a couple ways to approach this depending on your needs. If you just need to persist the language selection to the /signups/new route, then you could create a language service. Services are meant to handle information across routes. When the form on /language is submitted, update the service with the selection, then transition to the /signups/new route and inject the service there to look up the language.

If you need to remember the language selection on ALL routes and even through page reloads without persisting to the database, then I think using a URL is appropriate. This is common on internationalized websites–see Microsoft’s website that redirects to https://www.microsoft.com/en-us/ for U.S. visitors. If that’s the case and you don’t want to nest templates, you can render a route into a different template (e.g. a parent route’s template to avoid nesting): Rendering a Template - Routing - Ember Guides

I hope that makes sense :slight_smile: