Data binding

20 Feb 20171 minute to read

Local data binding

The local data can be an array of JSON objects which is assigned for the ListView widget’s datasource property. Refer the below example.

  • HTML
    • <ul data-role="ejmlistview" id="locallistbox" data-ej-datasource="window.dbitem" data-ej-fields-text="text"></ul>
  • JS
    • window.dbitem = [{ "text": "Discover Music" },
            { "text": "Sales and Events" },
            { "text": "Categories" },
            { "text": "MP3 Albums" },
            { "text": "More in Music" }];

    Remote data binding

    The ListView control also provides support for Remote data binding. Here the remote data is placed in Web service and you can render the list items from the web service using Service URL. The data is in JSONformat.

  • HTML
    • <ul data-role="ejmlistview" id="remotelistbox" data-ej-datasource="window.datasource" data-ej-fields-text="ShipCity" data-ej-itemscount="10">
            </ul>
  • JS
    • window.datasource = ej.DataManager({
            url: "http://mvc.syncfusion.com/Services/Northwnd.svc/Orders"
        });