Binding to local json file

[Brett]

I cannot get my json data to display in a List. Using firebug I can see that my json file is being called but my page is printing out each character as a seperate list item ie. not recognising the json object/schema.

SCRIPT

        $(document).ready(function () {
            var ds = new kendo.data.DataSource({
                transport: {
                    read: {
                        url: "data/team.json"
                    },
                    dataType: "json"
                }
            });
            $("#listview").kendoMobileListView({
                dataSource: ds
            });
        });

JSON
[
{ name: "Bob", title: "Mr" },
{ name: "Fred", title: "Sir" }
]

Any help would be appreciated. Files attached.

[Petyo]

Hello,

There are several problems with the code provided. 

1. The dataType option of the datasource needs to be set to the read config of the transport. 
2. The json provided is not valid. The keys need to be quoted too. 
3. Last of all, the listview will need a template set to work with the data. 

Find attached the modified project.


Greetings,
Petyo
the Telerik team

[Brett]

Thank you for the quick reply. It is working now. 

I did try using templates as per the documentation. I used template: "${data:name}". I can't find the documentation for the format you used in the example - template: "#:name#"

I'm assuming this is due to changes while the product is still in beta. (or maybe I'm just useless at reading docs)

[Petyo]

Hi,

It is not your fault. We are in the process of obsoleting the ${} syntax in favor of #:# syntax. They work in the exactly same way, the second one being more consistent with the # # and #= # syntax. 

The expressions inside the templates are actually javascript. So in your case ${data.name} would have worked.


Kind regards,
Petyo
the Telerik team

[Ganesan]

Hi,

 I need to update the list view data source based on tree view node click.I got the datasource as json using ajax call but can't able to set to list view.Can you able to help me on this to set the datasource.

function onSelect(e) {
        var id = e.sender.dataItem(e.node).get("id");

        $.ajax({
            type: "POST",
            url: '@Url.Action("getValuesonNodeClick", "Home")',
            data: { node: id }, // the data in JSON format.  Note it is *not* a JSON object, is is a literal string in JSON format
            success: OnGetSelectNodeSuccess,
            error: OnGetMemberError
        });

    }

 function OnGetSelectNodeSuccess(datasource1, status) {
 var dataSource = new kendo.data.DataSource({data: datasource1});
   $("#listview").kendoListView({
            dataSource: dataSource,
            template: "#:template#"
        });
}