mcp/carbon-components-svelte
1
0
Fork 0
mirror of https://github.com/carbon-design-system/carbon-components-svelte.git synced 2025-09-20 20:33:02 +00:00
Code Issues Projects Releases Packages Wiki Activity

fix(ComboBox): programmatically set selected index

Browse source
This commit is contained in:
István Pató 2022-01-11 12:59:44 +01:00
commit 11bb2a3b38
No known key found for this signature in database
GPG key ID: 3A842123BFF8E969
3 changed files with 45 additions and 13 deletions
Download patch file Download diff file Expand all files Collapse all files

7
docs/src/pages/components/ComboBox.svx
View file

@ -3,7 +3,7 @@
import { Button } from "carbon-components-svelte";
import Preview from "../../components/Preview.svelte";
let comboboxComponent
let selectedIndex = 1
</script>
### Default
@ -25,7 +25,12 @@ items={[
{id: "2", text: "Fax"}
]} />
### Programmatically set selected index
<FileSource src="/framed/ComboBox/ProgSelectedIndexComboBox" />
### Clear selection
<ComboBox titleText="Contact" placeholder="Select contact method"
bind:this={comboboxComponent}
items={[

18
docs/src/pages/framed/ComboBox/ProgSelectedIndexComboBox.svelte Normal file
View file

@ -0,0 +1,18 @@
<script>
import { ComboBox, Button } from "carbon-components-svelte";
let selectedIndex = 1;
</script>
<ComboBox
titleText="Contact"
placeholder="Select contact method"
bind:selectedIndex
items="{[
{ id: '0', text: 'Slack' },
{ id: '1', text: 'Email' },
{ id: '2', text: 'Fax' },
]}"
/>
<br />
<Button on:click="{() => (selectedIndex = -1)}">Set to -1 (unselected)</Button>
<Button on:click="{() => (selectedIndex = 2)}">Set to 2 (Fax)</Button>