Editing the selected option in the select dropdown



  • Hi,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.
    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?



  • 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'
    

    Answered here too:
    https://stackoverflow.com/questions/47035330/editing-the-selected-option-in-the-select-dropdownq-select-of-quasar-framewor/48227687#48227687