[Vuejs]-How to add Old data to select inputs (looping by vue.js) in form

by

0👍

I’m not sure I entirely understand what you’re looking for.

I think you just need to set the model (for v-model="model") to the id of the option that you want selected.

I’ve included a snippet below where it does this on mounted based on the oldCondition.

new Vue({
  el: "#app",
  data: () => {
    return {
      oldCondition: "Recondition",
      model: null,
      make: 0,
      model_options: [
        [{
          id: 1,
          text: "Brand New"
        }, {
          id: 2,
          text: "Recondition"
        }, {
          id: 3,
          text: "Used"
        }]
      ]
    };
  },
  mounted() {
    if (this.oldCondition)
      this.model = this.model_options[this.make].filter(x => x.text === this.oldCondition)[0].id;
  }


});
<script src="https://cdnjs.cloudflare.com/ajax/libs/vue/2.5.17/vue.js"></script>
<div id="app">
  <div>Old Condition: {{oldCondition}}</div>
  <br />
  <select class="form-control" name="model" id="model" v-model="model">
    <option>Select Condition</option>
    <option v-for="option in model_options[make]" :value="option.id" :key="option.id">@{{option.text}}</option>
  </select>
</div>

Leave a comment