0

JavaScript:

var books = new Vue({
    el: '#book_app',
    data : {
        book_list : ''
    }
    created: function() {
        $.ajax({
            type: 'get',
            url: '/admin/book/get',
            data: {
                member: memberCode
            },
            success: function (result) {
                this.book_list = result;
                $('#book_select').selectpicker('refresh');
            }
        });
    }
});

HTML:

...
<div id='book_app'>
    <select class='selectpicker' id='book_select'>
       //each book object has 'name' and 'code' attributes.
       <option v-for="book in book_list">{{book.name}}</option>
    </select>
</div>
...

I see all the books in Network tab in Chrome dev tool, also see all the option with book name in the Elements tab. But the options list doesn't appear in the web page.

SuperAsker
  • 41
  • 6
  • can you share any jsfiddle or code snippet or any live demo so that we can reproduce. – Niklesh Raut Aug 15 '18 at 02:45
  • also please try to remove this code `$('#book_select').selectpicker('refresh');` – Niklesh Raut Aug 15 '18 at 02:45
  • @C2486 Because it didn't work so I added `$('#book_select').selectpicker('refresh')` and it still `fails` – SuperAsker Aug 15 '18 at 02:48
  • can you share any jsfiddle or code snippet – Niklesh Raut Aug 15 '18 at 02:49
  • Possible duplicate of [How to access the correct \`this\` inside a callback?](https://stackoverflow.com/questions/20279484/how-to-access-the-correct-this-inside-a-callback) <- in reference to `this.book_list = result` in your `success` callback – Phil Aug 15 '18 at 04:36

0 Answers0