Topic: MDBSelect requires mutable options to function

jammerxd2 priority asked 6 months ago

Expected behavior

I should be able to create multiple Selects from the same array of options without having to create multiple copies of the array and have each select work independently - even when using the same code.

Actual behavior

I have to run extra code to create multiple copies of the options array for the MDBSelect component to function correctly when building forms that use a select in a v-for loop and all share the same options array.

Resources (screenshots, code snippets etc.)

This is horribly inefficient. Additionally, looking at the MDBSelect.vue component, I don't see any time where 'update:options' is emitted. So this requirement can go away entirely.

Please remove 'update:options' from the emits section of the component.

I don't currently have a snippet to share beyond the following:

<div v-for="item in items" v-bind:key="">
    <div class="input-group">
        <MDBSelect :label="`${} Assignment`" :options="selectOptions" :selected="getSelectedValueForItem(" @update:selected="(x:number)=>changeSelectionForItem(,x)" />
    this.selectOptions is a prop defined via props: ['selectOptions']
    getSelectedValueForItem is a function of the component:
        let selectedOptionId = -1;
        const results = this.editItem.mappings.filter((y:MappedItem)=>y.itemId === x);
        if(results.length > 0) selectedOptionId = results[0].optionId;
        return selectedOptionId;

    changeSelectionForItem is a function of the component:

        if(newSelection < 0)
            this.editItem.mappings = this.editItem.mappings.filter((y:MappedItem)=>y.itemId === itemId);
            const results = this.editItem.mappings.filter((y:MappedItem)=>y.itemId === itemId);
            if(results.length > 0)
                this.editItem.mappings =>{
                    if(y.itemId === itemId) y.optionId = newSelection;
                    return y;
                    itemId: itemId,
                    optionId: newSelection

Mateusz Trochonowicz staff answered 6 months ago

Hi, thank you for reporting this problem! We are going to add this to our "to do" list for next release and deep dive and check out how we can improve of this.

Keep coding!

jammerxd2 priority commented 6 months ago

Any idea when this will be?

Bartosz Cylwik staff commented 6 months ago

Unfortunately, we cannot give an exact date for that but the new version is going to be released Q1 2024.

Please insert min. 20 characters.


Hire our experts to build a dedicated project. We'll analyze your business requirements, for free.



Specification of the issue

  • ForumUser: Priority
  • Premium support: Yes
  • Technology: MDB Vue
  • MDB Version: MDB5 4.1.1
  • Device: Any
  • Browser: Any
  • OS: Any
  • Provided sample code: No
  • Provided link: No