Search code examples
mobilecheckboxdevextremephonejs

How to access item data from dxList ,Devextreme Mobile


HTML

<div data-bind="dxList: { dataSource: dataSource }">
  <div data-options="dxTemplate : { name: 'item' } " >
    <div class="list-item" data-bind="text: name"></div>
    <div data-bind="dxCheckBox: {value: check }"></div>
  </div>
</div>

<div data-bind="text: 'Save', click: save"></div>

Javascript

var dataSource = ko.observableArray([]);
dataSource.push({ name: "name1", check: true });
dataSource.push({ name: "name2", check: false });
save: function () {

}

How to get 'name' and 'check' values inside save function,Devextreme mobile?


Solution

  • You just can use the dataSource array.

    var save = function () {
        var items = dataSource();
    
        console.log(items[0].name + " - " + items[0].check());
        console.log(items[1].name + " - " + items[1].check());
    };
    

    If you want to get only checked items, you can use the jQuery.grep function to filter data.

    var items = $.grep(dataSource(), function(item){
        return item.check() === true;
    });
    

    Also, I suggest you use the ko.observable() to define the check field of items. It allows you to track changes of the check field.

    http://jsfiddle.net/d4t1pqby/3/