1

i have my code

HTML

<div v-for="(edu, index) in fetch" :key="edu.id">
    <v-col cols="2">
        <v-btn
          class="mr-3" @click="handleEdit(edu, index)">
        </v-btn>
    </v-col>
    <v-col cols="12" sm="6" md="6">
        <v-select
          :items="item_bulan"
          v-model="add_graduate_month"
          item-value="id"
          item-text="name"
          label="month"
          dense
        ></v-select>
       <p>Selected ID: {{ add_graduate_month }}</p>
    </v-col>
</div>

here I edit the data in the dropdown

an this fuction

export default {
      name: "Education",
      data: function() {
        return {
          item_bulan: [
              {id:'1', name:"Jan"},
              {id:'2', name:"Feb"},
              {id:'3', name:"Mar"},
              {id:'4', name:"Apr"},
              {id:'5', name:"Mei"},
              {id:'6', name:"June"},
              {id:'7', name:"Jul"},
              {id:'8', name:"Ags"},
              {id:'9', name:"Sep"},
              {id:'10', name:"Okt"},
              {id:'11', name:"Nov"},
              {id:'12', name:"Des"},
            ],
          add_graduate_month: null,
        };
      },
 computed: {
   fetch() {
     return this.$store.state.education;
    },
  },
   methods:{
    handleEdit(edu, index) {
      alert(edu.graduate_month)
      this.add_graduate_month = edu.graduate_month;
    },
}

I created a dropdown containing the month's value data, namely the id. here I managed to get the value from the database which contains the value "1" but when I edit, the value doesn't appear in the dropdown, when using v-text, this value is displayed, how to get the value into v-select?

how could this happen?

image

Jon
  • 109
  • 2
  • 10

1 Answers1

0

When you are assigning a value to the add_graduate_month which is attached to the v-select, then the value of add_graduate_month should match with one of the values from the item_bulan.

So, if you are getting 1 from the database then your add_graduate_month value should be {id:'01', name:"Jan"}.

Yash Maheshwari
  • 1,842
  • 2
  • 7
  • 16
  • I have deleted the number 0 in item_month, but still unable to enter that value into v-select @Yash Maheshwari – Jon May 20 '21 at 05:55
  • But, you need to have the value in the same format as one of the object in the item_bulan array. – Yash Maheshwari May 20 '21 at 06:13
  • okay just now I have the name attribute on item_bulan, so it only contains id, in item_bulan, but still can't – Jon May 20 '21 at 06:15
  • Instead of this in data `add_graduate_month: null` set it to {id:'1', name:"Jan"}. You will then see `Jan` in the v-select, so what I mean is that whenever you are assigning a value to `add_graduate_month` then it need to be in this format `{id: 1, name: 'Feb'}`. If you will assign the `add_graduate_month` with simple value somthing like 1, then it will not work. – Yash Maheshwari May 20 '21 at 06:23
  • add_graduate_month is dynamically user insert result. – Jon May 20 '21 at 06:41
  • So where you are storing the value getting from db? – Yash Maheshwari May 20 '21 at 06:49
  • the result of lopping above, get by id @Yash Maheshwari – Jon May 20 '21 at 06:56
  • So, means you are using `edu.id` to get the data from result? or `edu` contains the result from data? Not clear. – Yash Maheshwari May 20 '21 at 07:01