Drop down menu active link from url parameter

Wappler General How To
#1

HI,
is there a way to have a drop down, that simply has “Active / Inactive” as its only two options (no title per se), and the active link is based off the url parameter.

so in the screenshot it says “job status”, i prefer it not to have that and just be “active” or “inactive” depending on the URL parameter passed (I pass it ?status_id=1 or 0).

wappler
wappler1008×625 51 KB

Hope that makes sense? Thanks in advance

Darren

#2

So are you wanting it to show either active or inactive, and if they click on the drop down, it will show the other option?

I.e. what you have in the pic apart from the job status title?

If so, I’m sure there’s a number of ways of going about it. You could look at using a Select Input instead of a dropdown. That way you’ll only have two options and the dynamically selected one (based on the parameters) will be the visible option.

You could also use dynamic text to change the “Job Status” to read either active or inactive and when clicked just opens the drop down as per normal.

#3

hi, thanks Philip,yeah select list, I should have thought of that to remove the heading, so I will do that, then what happens at the moment is when they select from the drop down it reloads the page with the url parameter and updates the page contents (showing active or inactive jobs), but want what they selected to be the active link/selected option, thanks

#4

That’s not natively offered by the Bootstrap 4 dropdown component, but you can use the following code for the dropdown text. So it should be something like:

{{query.status_id && query.status_id == 1 ? 'Active' : query.status_id && query.status_id == 0 ?  'Inactive' : 'Job Status' }}

Anyway, Philip’s suggestion to use a select menu is a really good option.

#5

thanks guys. So i dropped the dropdown and used the select list, with before change event to submit the form to filter the query by the url parameter. Just can’t work out how in wappler to have the select list item selected by the url parameter, I know how to do it in php, but not in wappler, is it possible?
thanks

#6

Just use the selected attribute like:

<option value="1" dmx-bind:selected="query.status_id == 1">Active</option>
#7

wow, perfect, that worked a treat, thankyou both

1 Like