Sunday, May 21, 2017

Vue.js Access data from selected option

<tbody>
  <tr v-for="(item, index) in form.items">
    <td>
      <select class="form-control" v-model="item.product_id">
        <option>Select</option>
        <option v-for="product in option.products" :value="product.id">
           | 
        </option>
      </select>
    </td>
    <td><input type="text" :value="option.products[2].description" class="form-control"></td>
    <td><input type="text" class="form-control"></td>
    <td><input type="text" v-model="item.qty" class="form-control"></td>
    <td>
      123
      <!--   -->
    </td>
    <td>
      <button class="btn btn-default" type="button" @click="form.items.splice(index, 1)">&times;</button>
    </td>
  </tr>
</tbody>

Hello. I need to access the product data, like description, that is inside in option.products by the product.id selected in option section,

I'm trying with :value="option.products[item.product_id].description" but it does not have a default value. Any idea how I can do this?



via SkyNess

Advertisement