Reputation: 5440
I am developing a mobile app using Kendo ui mobile and Phonegap.I have a JSON data, Here . I want to bind this JSON to kendo ui mobile listview. I have tried following code, but its not working. It not even showing the listview. Can anyone please help me? Thanks.
function mobileListViewEndlessScrolling() {
var dataSource = new kendo.data.DataSource({
serverFiltering: true,
transport : {
read: {
type : "GET",
url : "http://www.json-generator.com/j/bZnjoTdIuq?indent=4",
contentType: "application/json; charset=utf-8",
dataType : "json",
error : function (xhr, ajaxOptions, thrownError) {
alert("error " + xhr.responseText);
}
}
},
schema : {
data: "Data"
},
type : "json",
parameterMap : function (options) {
return JSON.stringify(options);
}
});
$("#endless-scrolling").kendoMobileListView({
dataSource: dataSource,
template: $("#endless-scrolling-template").text(),
endlessScroll: true
});
}
and here is my listview item template,
<script type="text/x-kendo-tmpl" id="endless-scrolling-template">
<div class="product">
<img src="images/image.jpg" alt="#=ProductName# image" class="pullImage"/>
<h3>#:ProductName#</h3>
<p>$#:kendo.toString(UnitPrice, "c")#</p>
<a id="minus" data-role="button" onclick="minus(#:ProductID#)" >-</a>
<label id=#:ProductID#>0</label>
<a id="plus" data-role="button" onclick="plus(#:ProductID#)" >+</a>
<a id="loginButton" data-role="button" data-click="login">Add to Cart</a>
<div class="console"></div>
</div>
Upvotes: 1
Views: 2217
Reputation: 5440
I have solved the issue. I had to remove the line endlessScroll: true
I dont know why its not working with that line included.
Upvotes: 1