dimanche 26 juin 2016

Binding two-way in Vuejs not working on display

I have a project in Laravel for backend and VueJs for Front end.

I fetch data with my vueJs object using Api programmed in Laravel. My data is Fetched. In my example i get Article data.

 fetchFamily: function(level , id){
        this.$http.get('/api/family/' + id, function (data) {
            var select_zone = 'options' + level
            this.$set(select_zone, data);
        })
        //Fetch Article
        this.$http.get('/api/family/' + id +'/material', function (data) {
            this.$set('materials', data);
        })

    },
    onSelectArticle: function(id){
        var self = this;
        jQuery.each(this.materials,function(idx,dta){
            if(dta.id == id){
                dta.qte = 0
                self.items.push(dta);
                return false;
            }
        });
        $('#myModalArticle').modal('hide');


    }

But when i want to initialize the quantity data to 0.

 dta.qte = 0

I have a problem that in my table i have a input binding to this data.

 <tr v-for="item in items">                                                                             <td class="hidden-sm"><a  href="/final/doc//edit"> @</a></td>
                                                                    <td width="20%"> @
                                                                    </td>
                                                                    <td>18.00</td>
                                                                    <td><input type="text" v-model="item.qte"  ></td>
                                                                    <td>@</td>
                                                                    <td>Colis</td>
                                                                    <td>10%</td>
                                                                    <td>16.20</td>
                                                                    <td>@</td>
                                                                    <td>18</td>

And when i am trying to change this value, in my screen the value doesn't change. And in my console when i check the value the value was changed.!!

vmApp.items[0].qte

Thank you for your Help!



via Chebli Mohamed

Aucun commentaire:

Enregistrer un commentaire