Kendo UI

jQuery + Kendo UI + MockJax

by jwstott

HTML

<link rel="stylesheet" href="http://cdn.kendostatic.com/2012.1.229/styles/kendo.common.min.css">
<link rel="stylesheet" href="http://cdn.kendostatic.com/2012.1.229/styles/kendo.blueopal.min.css">
<script src="http://cdn.kendostatic.com/2012.1.322/js/kendo.all.min.js"></script>
<script src="https://raw.github.com/appendto/jquery-mockjax/master/jquery.mockjax.js"></script>
<script src="https://raw.github.com/burkeholland/kendo-plugins/master/DataSource/kendo.repeater.js"></script>
<div id="repeater"></div>
  
<div id="container">
    <div data-role="repeater" data-source="source: dataSource" data-template="template"></div>
</container>
    
<script type="text/x-kendo-template" id="template">
    <div style="float: left; color: salmon; margin-right: 10px"><h1>#= data #</h1><span data-bind="text: data"></span></div>
</script>

JavaScript

$.mockjax({
  url: '/items.json',
  responseTime: 200,
  responseText: [ "item1", "item2", "item3" ]
});

var dataSource = new kendo.data.DataSource({
    data:[ "item1", "item2", "item3" ]
});
dataSource.read();
kendo.bind($("#container"));

/*
$("#repeater").kendoRepeater({
    dataSource: [ "item1", "item2", "item3" ]
});
*/