Results 1 to 2 of 2

Thread: Extjs Dataview

  1. #1
    Sencha User
    Join Date
    Sep 2014
    Location
    Philippines
    Posts
    4

    Default Answered: Extjs Dataview

    Hello guyz, I would to ask for help.
    My concern is how to add delete function on my custom delete icon.

    I have my sample code here:
    Ext.onReady(function() {
    Ext.define('LogEntry', {
    extend: 'Ext.data.Model',
    fields: [
    { name: 'text', type: 'string' }
    ]
    });

    Ext.create('Ext.panel.Panel', {
    width: 500,
    height: 300,
    renderTo: Ext.getBody(),

    layout: 'fit',

    items: [{
    xtype: 'dataview',

    store: Ext.create('Ext.data.Store', {
    model: 'LogEntry',
    data: [
    { text: 'item 1' },
    { text: 'item 2' },
    { text: 'item 3' },
    { text: 'item 4' },
    { text: 'item 5' }
    ]
    }),

    tpl: Ext.create('Ext.XTemplate',
    '<tpl for=".">',
    '<div class="logentry">',
    '<span>{text}</span>',
    '<div class="removeicon"></div>',
    '</div>',
    '</tpl>'
    ),

    itemSelector: 'div.logentry',
    trackOver: true,
    overItemCls: 'logentry-hover',

    listeners: {
    'itemclick': function(view, record, item, idx, event, opts) {

    if(event.target.className === 'removeicon'){
    alert('you clicked the x icon');
    }

    // How can I add delete function ?
    console.warn('This is example code!');
    }
    }
    }]
    });
    });



    Thank you so much!

  2. Hi--

    You're nearly there

    Your dataview is bound to a store, so all you should have to do is get the store, pass the record (argument #2 of your "itemclick" handler) to the remove() method, and it's done.

    I've included an example Fiddle below.

    Hope that helps!
    Thanks
    Joel


  3. #2
    Sencha User joel.watson's Avatar
    Join Date
    Nov 2014
    Posts
    3,120
    Answers
    446

    Default

    Hi--

    You're nearly there

    Your dataview is bound to a store, so all you should have to do is get the store, pass the record (argument #2 of your "itemclick" handler) to the remove() method, and it's done.

    I've included an example Fiddle below.

    Hope that helps!
    Thanks
    Joel


Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •