How can I set dataSource to devextreme dxList with jQuery

Question

I'm just learning DevExtreme Mobile. I want to use dxList with Jquery. I'm using as a reference site http://js.devexpress.com/Documentation/ApiReference/UI_Widgets/dxList/?version=14_1 But the web site teaching KnockOut.js I do not know knockout.js

How can I set dataSource to devextreme dxList with jQuery?

Answer 1

That's pretty easy. Read about jQuery approach to create widgets in DevExtreme http://js.devexpress.com/Documentation/Howto/UI_Widgets/Basics/Create_a_Widget/#UI_Widgets_Basics_Create_a_Widget_Add_a_Widget_jQuery_Approach

For the example specified check out the fiddle http://jsfiddle.net/tabalinas/eerpy2wf/

You can create a list like following:

<div id="list"></div>

$("#list").dxList({ 
    dataSource: employees, 
    grouped: true,
    groupRender: function(group) {
        return group.key;
    },
    itemRender: function(emp) {
        return $("<div>").text(emp.name + "(hired at " + emp.hired + ")");
    }
});

Just use renderers instead of ko tempaltes.