getting index value 0 from dataview any list itemtap from sencha touch

Question

I am unable to get index value form the dataview:

    {          
              xtype: \'list\', 
              itemId: \'catList\',
              store: \'Categ         


        

Answer 1

I tried and working perfectly for me, Let me share what i did.

Model

Ext.define('Myapp.model.Category', {
    extend: 'Ext.data.Model',
    config: {
        fields: [
            { name: 'cat_id', type: 'integer' },
            { name: 'category_name', type: 'string' },
            { name: 'created_date', type: 'string' },
            { name: 'order', type: 'integer' },
            { name: 'status', type: 'integer' },
            { name: 'deleted', type: 'integer' },
            { name: 'type', type: 'integer' }
        ]
    }
});

Store

Ext.define('Myapp.store.Category', {
    extend: 'Ext.data.Store',
    requires: [
        'Myapp.model.Category'
    ],
    config: {
        storeId: 'category',
         model: "Myapp.model.Category",
         proxy: {
            type: "ajax",
            url : "http://alucio.com.np/trunk/dev/sillydic/admin/api/word/categories/SDSILLYTOKEN/650773253e7f157a93c53d47a866204dedc7c363?_dc=1376475408437&page=1&start=0&limit=25",
            reader: {
                type: "json",
                rootProperty: "data"
            }
        },
        autoLoad: true
    }

});

List

 {          
    xtype: 'list', 
    itemId: 'catList',
    store: Ext.create('Myapp.store.Category'),
    layout: 'fit',      
    itemHeight: 20,
    itemTpl: [
              '<div>',
              '{category_name}',             
              '</div>'],
            listeners: {
               itemtap: function(list, index, target, record, e, eOpts){
                 console.log(record.get('cat_id'));
            } 
     } 
  }

Output

As you can see itemtap function also printing correct cat_id

UPDATE

Based on your comment

{    
   xtype :'panel',
   items : [{
       xtype : 'toolbar',
       itemId: 'categoryName'  // Give itemId  
      },
      {
       xtype: 'list', 
       itemId: 'catList',
       height : '100%',
       store: Ext.create('GoodNews.store.Category'),
       layout: 'fit',      
       itemHeight: 20,
       itemTpl: [
         '<div>',
         '{category_name}',             
         '</div>'],
         listeners: {
           itemtap: function(list, index, target, record, e, eOpts){
             var catId = record.get('cat_id');
             var categoryName = record.get('category_name');
             // Set the title like this
             this.getParent().getComponent('categoryName').setTitle(categoryName);
           } 
         }                
       }]     

 }

Answer 2

I don't really know what's wrong with your code as I tested it and it worked fine. However, a few things are wrong.

• You do not need the for loop in your itemTpl as "itemTpl" is already iterating in you data array for you. You would need it if you were using just "tpl".
• Avoid to have your listeners in your view. Instead, get a reference to your list in your controller, and set the listeners there. This is bad practise and it breaks the NVC pattern.

Here is a small version that works on my te4st application:

{
    xtype: 'list', 
    itemId: 'catList',
    scrollable: false,
    data: [
        { category_name: 'A', cat_id: 1},
        { category_name: 'B', cat_id: 2},
        { category_name: 'C', cat_id: 3},
        { category_name: 'D', cat_id: 4},
        { category_name: 'E', cat_id: 5},
    ],
    loadingText: "Loading Words...",
    emptyText: '<div>{message}</div>',
    autoLoad:true,
    itemTpl: '{category_name}',   
    listeners: {
        'itemtap': function(list, index, target, record, e, eOpts){
            //TODO: whatever..
        }
    }
}