nav[aria-label="Primary Navigation"] { padding: 0; & ul { list-style: none; width: 100%; display: flex; flex-direction: row; justify-content: start; align-items: start; gap: 30px; padding: 0; & li { margin: 0; } & ul li { list-style: none; } } }

How to add a new option to single select programmatically?

Jose Luis3

I don't seem to be able to find how to do this anywhere, I've tried adding a new aui-option to the datalist but even though the new option does appear on the list it won't be there when you search for it by writing on the input field.

Is there some way to do this?

Accepted answers

Sean Curtis

There's no way to add a new option programatically (yet). You could use the async version and back it with a rest resource which could provide more results.

Alternatively you can add the "can-create-values" attribute to the element, and then set it's value to something. It will appear as a special option in the list with "(new value)" after it.

http://jsbin.com/gogoyo/edit?html,js,output

All comments

Nic Brough -Adaptavist-

I may be misunderstanding the question here, but a single-select list's options are determined by data in the database. Aui has nothing to do with that, it's for the front-end. They're not related to each other.

Jose Luis3

I'll try to explain here, I'm following the first example in (https://docs.atlassian.com/aui/latest/docs/single-select.html), the synchronous one. When I write the options on the template like that it works fine, but I want to be able to add or remove options afterwards since they should change depending on what the user chooses on another field.

Nic Brough -Adaptavist-

Ah, ok, so you already have the list from the database and you just want to remove (or re-add) existing options. I'm afraid I don't know javascript well enough to help you there.

Sean Curtis

There's no way to add a new option programatically (yet). You could use the async version and back it with a rest resource which could provide more results.

Alternatively you can add the "can-create-values" attribute to the element, and then set it's value to something. It will appear as a special option in the list with "(new value)" after it.

http://jsbin.com/gogoyo/edit?html,js,output

Jose Luis3

Those options don't quite work for what we want but thanks anyway.

Welcome!

It looks like you're new here. Sign in or register to get started.

Quick Links

Find more posts tagged with

jira

select-list

aui