显示来自json的数据

Question

I am having problem in displaying data in listview from json format,this is my code that i have used to do this:

<div data-role="view" data-title="Home" data-layout="main" data-model="APP.models.home" id="bloggerView" data-show="showBloggers">
    <h1 data-bind="html: title"></h1>


    <ul id="bloggerList"
        data-source="bloggersData"
        data-endlessScroll="true"
        data-template="bloggersTemplate"
        data-role="listview"
        data-style="inset"></ul>

    </div>

    <script id="bloggersTemplate" type="text/x-kendo-template">

        <a href="\#BloggerDetailsView" class="km-listview-link" data-role="listview-link">
            <h2>#=data.id#</h2>
            <h4>#=data.nom#</h4>
        </a>
        </script>
    <script type="text/javascript">
        jQuery.support.cors = true;
     var bloggersData;
            bloggersData=new kendo.data.DataSource(
            {
            transport :{
            read: {
                url: "http://127.0.0.1:8080/webservicesV1/cuisines.php",
                type: "Get",
                data: {

            }
            }
            }
            });
            function showBloggers() {
                bloggersData.fetch();
                console.log(JSON.stringify(bloggersData.data()));
                console.log("test_fetch");
            }


    </script>

this is my json data:

{
success: 1,
message: "cuisine trouve!",
cuisines: [
{
id: "1",
nom: "maltaine"
},
{
id: "2",
nom: "française"
}
]
}

this is what I get as a result in console,and an undified values in my list:

VM220:17 []
VM220:18 test_fetch

thanks for help

Answer 1

Pass a callback to the fetch method:

bloggersData.fetch(function () {
    console.log(JSON.stringify(this.data()));
    console.log("test_fetch");
});