CODEWITHSUNDEEP
laravel-5vue.jsvuejs2
Rocky
Rocky

Reputation: 431

push value in select option in vue

I m new to Vue and don't know how to solve this kind of problem I search a lot but haven't find any solution related to my problem here is my code 

<tbody >
   <tr v-for="(col, index) in cols">
     <td>12345</td>
     <td><select class="form-control" v-model="col.select1" >
           <option>Select Shop</option>
           <option v-for="option1 in options1" :value="option1.name">
           {{option1.name}}</option>
        </select>
     </td>
</tbody>
<script>
 export default {

    data(){
       return{
          cols: [],
          options1:[]
           }
      },
  methods:{
     getshop(){
      var _this=this
      return this.$http.get('http://localhost:3000/api/companyproducts') .then(function (response) {  
              return  response.data;
               })
             },
       onClick(){

            this.cols.push({
            this.options1:this.getshop(), //how i can push getshop return value to select option
            qty:0 });
             },
      },    
 }
</script>

suppose if my table has 3 value then 3 row getting created along with 3 select option in ShopIdFrom column as show in image now the problem is that when i m try to push the value getting from getshop function into select option. i.e ShopIdFrom select option i does not have any option value enter image description here .i.e this.cols.push not working for dynamically select option. what i m doing wrong or is there any other way to achieve this

Upvotes: 0

Views: 1670

Answers (1)

bipin
bipin

Reputation: 419

try this hope it will help you

        onClick(){
             var t;
             var _this=this
              this.getshop().then(function(value) {
                _this.options1= value
                });
           this.cols.push({
               select1:'',
               qty:0 });

             },

Upvotes: 0

Related Questions