JSFiddle - React, Tailwind, and code Playground
HTML
<script src="http://cdn.kendostatic.com/2012.2.710/js/kendo.all.min.js"></script>
<link rel="stylesheet" href="http://cdn.kendostatic.com/2012.2.710/styles/kendo.mobile.all.min.css">
<div data-role="view" data-layout="app_backbutton" data-title="page_test" id="page_test" data-transition="slide" data-init="mobileListViewDataBindInitGrouped">
<h2>Test remote datasource</h2>
<ul id="grouped-listview"></ul>
</div>
JavaScript
var datakilde = new kendo.data.DataSource({
transport: {
read: {
contentType: "application/json",
// the remote service url
url: "http://jsfiddle.net/echo/jsonp/",
// JSONP is required for cross-domain AJAX
dataType: "jsonp",
// additional parameters sent to the remote service
data: {
result: JSON.stringify([{
name: "a",
letter: "a"},
{
name: "b",
letter: "b"}])
}
}
},
// describe the result format
schema: {
// the data which the data source will be bound to is in the "results" field
data: "result",
parse: function(response) {
response.result = JSON.parse(response.result);
return response;
}
}
});
//var datakilde = new kendo.data.DataSource.create([{name: "bar", letter:'b'}, {name: "baz", letter: 'bb'}])
function mobileListViewDataBindInitGrouped() {
$("#grouped-listview").kendoMobileListView({
dataSource: datakilde,
template: "<strong>#:data.name#</strong>"
});
}
var app;
$(function() {
app = new kendo.mobile.Application($(document.body), {
platform: 'ios'
});
});