Search code examples
javascriptsencha-touchsencha-touch-2sencha-touch-2.1sencha-touch-2.2

Displaying list of checkboxfield from store data in Sencha Touch


I am new to Sencha Touch. I am trying to build a simple ToDo app. So far I have tried displaying a list of tasks data from store using Ext.dataview.List and its itemTpl

Ext.define('ToDoListApp.view.TaskList', {
    extend: 'Ext.dataview.List',
    requires: [ 'ToDoListApp.store.TaskStore' ],

    config: {
        displayField: 'title',
        id: 'taskList',
        itemTpl: '<div class="task completed_{done}">{title}</div>',
        store: Ext.create('ToDoListApp.store.TaskStore'),
    }
});

However, what I'm really trying to achieve is to display a list of checkbox fields based on the data from store. I'm looking for a config that uses the object below instead of itemTpl:

{
    xtype: 'checkboxfield',
    checked: true, /* should be based on the "done" value */
    label: 'Test', /* should be based on the "title" value */
}

Is this possible? If not, what would be a good way to achieve similar results?

Best Regards,

Erwin


Solution

  • What you are looking for is to create a custom dataItem by extending it.

    You can find and example at:

    http://www.sencha.com/blog/dive-into-dataview-with-sencha-touch-2-beta-2/

    Hope it helps-