[Vuejs]-Laravel data dependent on selected dropdown

by

0👍

Try this one, hope it will meet your requirement

in your template’s select option

   <select @click="selectProduct(product)"  class="custom-select" v-model="form.product_id">
        <option disabled value="">Select Product</option>
        <option v-for="product in products" :key="product.product_id" :value="product.product_id">{{product.product_name}} </option>
   </select>

in export default:

 data() {
        return {
            selected: this.products ? this.products[0] : null
        };
    },
    methods: {
       selectProduct(product) {
            this.selected = product;
            this.$emit('selected', product);
            }
    },

On your template: Assuming your quantity in product.product_qty. change this as per your required 

  <td><input :class="{ 'selected': product == selected }" name="product_qty" value="" class="form-control" disabled>{{ product.product_qty }}</input></td>

Leave a comment