Disabled select option

Questions
1

Hi!

I’m trying to render an option into a select (simple dropdown, NOT smart select!) with disabled attribute based on some store’s conditions. I’m going crazy with this… I’m using f7 v6. Here is my code:

	${first_condition && $h`
		<div>
		...
			<select>
				<option ${condition && $h`disabled`}>text</option>
			</select>
		...
		</div>
	`}

If I put ${condition && $hdisabled} into text value it works, for example… What am I doing wrong?

Please, help! :cry:

2

Solved this way:

disabled=${condition}
3

You can also try with the “disabled” css class in the component

4

@fabricio Thanks for the reply, but it not works for select’s option…

5

I just ran into the same problem (using F7 7.0.5:)

${isSelect ? $h${options.map((o) => $h<option value="${o}" selected=${o==value} >${o}</option>)} : ''}

None of the above mentioned worked.
If I change the selected attribute to something else :

${isSelect ? $h${options.map((o) => $h<option value="${o}" data-test=${o==value} >${o}</option>)} : ''}

the attribute is set fine…

Any other ideas?

6

It turns out it works, if I put the value into quotes, like so:

selected="${o==value}"

all:

${isSelect ? $h ${options.map((o) => $h<option value="${o}" selected="${o==value}" >${o}</option> )} : ''}