vuejs wrappers- support for dataSource refresh?

4 posts, 1 answers
  1. milind
    milind avatar
    2 posts
    Member since:
    Jan 2018

    Posted 30 Jan 2018 Link to this post

    I am trying to bind a combobox to a dynamic array defined on Vue instance. The values on the array are not known until the control is databound. I can't seem to figure why change to the array won't refresh the combo. Here's the code snippet. Does current version pf kendo-vue support this behavior?

     

    //javascript

    var that = this;

    that.$set(that, 'countryArray', [{text: 'canada', value:'2' }]);

    //html

    <kendo-combobox v-model="countrySel"
    :placeholder="'Select country...'"
    :data-source="countryArray"
    :data-text-field="'text'"
    :data-value-field="'value'"
    :filter="'contains'"
    >
    </kendo-combobox>

  2.
  3. Answer
    Dimitar
    Admin
    Dimitar avatar
    526 posts

    Posted 31 Jan 2018 Link to this post

    Hello Milind,

    The described behavior is already implemented and is part of the new reactivity changes that are scheduled to be released with the next Service Pack (2018 R1 SP1) in late February.

    Currently, as a workaround for the issue, a watcher can be defined which will use the setDataSource() method to update the widget data:
    <script>
    new Vue({
    el: "#vueapp",
    data: function() {
    return {
    dataSourceArray: [ 'Football', 'Basketball']
    }
    },   
    mounted: function() {
     this.dataSourceArray = ['New value 1', 'New value 2']
    },
    watch: {
    dataSourceArray (val) {
     this.$refs.combobox.kendoWidget().setDataSource(val)
    }
    }
    })
    </script>

    The above is demonstrated in action on the following Plunker.

    Regards,
    Dimitar
    Progress Telerik
    Try our brand new, jQuery-free Angular components built from ground-up which deliver the business app essential building blocks - a grid component, data visualization (charts) and form elements.
  5. milind
    milind avatar
    2 posts
    Member since:
    Jan 2018

    Posted 13 Feb 2018 in reply to Dimitar Link to this post

    @Dimitar - Does 2018.1.212 address this issue? 
  7. Dimitar
    Admin
    Dimitar avatar
    526 posts

    Posted 14 Feb 2018 Link to this post

    Hello Milind,

    I can confirm that the reactivity changes for the Kendo Vue wrappers are released with the specified version (2018.1.212). You can test it out to verify that everything is working as expected.

    Regards,
    Dimitar
    Progress Telerik
    Try our brand new, jQuery-free Angular components built from ground-up which deliver the business app essential building blocks - a grid component, data visualization (charts) and form elements.
Back to Top