Skip welcome & menu and move to editor
Welcome to JS Bin
File
Add library
Share
Login or Register
Blog
Help
Load cached copy from
  • Run with JS
  • Save
  • Share
  • …
 
<!DOCTYPE html>
<html>
<head>
<script src="http://cdnjs.cloudflare.com/ajax/libs/knockout/2.2.1/knockout-min.js"></script>
<link href="http://cdn.kendostatic.com/2013.2.716/styles/kendo.common.min.css" rel="stylesheet" type="text/css" />
<link href="http://cdn.kendostatic.com/2013.2.716/styles/kendo.rtl.min.css" rel="stylesheet" type="text/css" />
<link href="http://cdn.kendostatic.com/2013.2.716/styles/kendo.default.min.css" rel="stylesheet" type="text/css" />
<link href="http://cdn.kendostatic.com/2013.2.716/styles/kendo.dataviz.min.css" rel="stylesheet" type="text/css" />
<link href="http://cdn.kendostatic.com/2013.2.716/styles/kendo.dataviz.default.min.css" rel="stylesheet" type="text/css" />
<link href="http://cdn.kendostatic.com/2013.2.716/styles/kendo.mobile.all.min.css" rel="stylesheet" type="text/css" />
<script src="http://code.jquery.com/jquery-1.9.1.min.js"></script>
<script src="http://cdn.kendostatic.com/2013.2.716/js/kendo.all.min.js"></script>
<meta charset=utf-8 />
<title>JS Bin</title>
</head>
<body>
  
<div data-role="listview" data-type="layout" id="event-view" data-bind:"eventsViewModel">           
<ul data-role="listview" data-style="inset" data-type="group">
<li>Ereignisse
 <ul data-bind="foreach: events">
  <li>
   <span data-bind="text: title"></span>                    
</li>
                    </ul>
                </li>
            </ul>
        </div>
</body>
</html>
 
//The data hard-coded into the js-file
var eventsDataSource = new kendo.data.DataSource({
    data:[
    {   id:3,
        created:1385573907907,
        priority:1,
        reporter:"Martin",
        category:"Mähdrescher",
        type:"S690",
        title:"Hangausgleich defekt",
        message:"Mhdrescher umgekippt",
        status:"offen",
        client:"Bauer",
        field:"Kaiserslautern - Kohlbach",
        scenario:0,
        document:true,
        positionLatitude:49.405703, 
        positionLongitude :7.423623},
    
    {   id:1,
        created:1385739507907,
        priority:3,
        reporter:"T670-4",
        category:"Mhdrescher",
        type:"T670",
        title:"Hydraulikdruck unter Minimalwert",
        message:"Hydraulikdruck unter 200 bar",
        status:"offen", 
        client:"Meyer", 
        field:"Homburg - Auf der Hh",
        scenario:0, 
        document :false, 
        positionLatitude:49.342852,
        positionLongitude:6.824287},
    {   id:2,
        created:1385656707907,
        priority:2,
        reporter:"Anna",
        category:"Traktor",
        type:"9560RT",
        title:"Kette gerissen",
        message:"Linke Kette gerissen",
        status:"offen",
        client:"Schulze",
        field:"Kaiserslautern - Feldstraße",
        scenario:0, 
        document:false, 
        positionLatitude :49.402715, 
        positionLongitude :7.445082}
    ]
});
​
eventsDataSource.read();
var eventsObj = eventsDataSource.data().toJSON();
​
​
var eventsViewModel ={ events : ko.observableArray(eventsObj) };
​
console.log(eventsViewModel.events().length);
​
ko.applyBindings(eventsViewModel,document.getElementById("event-view"));
Output

You can jump to the latest bin by adding /latest to your URL

Dismiss x
public
Bin info
anonymouspro
0viewers