CODEWITHSUNDEEP
vuejs2quasar-framework
swathi
swathi

Reputation: 156

Editing the selected option in the select dropdown(<q-select> of quasar framework)

I am trying the edit the previously selected option in the select drop down.I am able to show the checked options based on the data driven from the service call, but not able to choose other select option in the drop down.I am using quasar framework and vue.js. Code:

<q-select
 multiple 
stack-label="Actions"
v-model="multiSelect"
:options="options"/>

Script:

import {QCheckbox,QSelect} from 'quasar'export
 default {components: {QCheckbox,QSelect},
data () {return {
multSelect: [],
options1: [{label: 'X-B',value: 'x-b'},{label: 'RT-Builder',value: 'rt-builder'},{label: 'Com',value: 'com'},{label: 'Max',value: 'max'},{label: 'Runner',value: 'runner'},{label: 'Opto',value: 'opto'}],
....................
created () {
axios.get('http://*********/getDetails').then(response => {
this.multiSelect = response.data
})
}

Can someone help me with this?

Upvotes: 2

Views: 8278

Answers (1)

Maxime Pacary
Maxime Pacary

Reputation: 23041

The value you store in your component property multiSelect should be an array of the selectable values you want to be checked:

For example (following your data set):

this.multiSelect = ['x-b', 'rt-builder', 'max']

Whereas for "simple" select fields (single choice)

<q-select ... v-model="selectedValue" :options="options" />

you simply do

this.selectedValue = 'identifier'

Upvotes: 1

Related Questions