How to delete items from a Tree

Question

I've attempted to use this example and add basic CRUD to a tree.

http://dev.sencha.com/deploy/ext-4.0.0/examples/tree/treegrid.html

For now, I just want to delete an item from the tree. I've added button and have this under click:

click : function() {;
    var record = tree.getSelectionModel().getSelection()[0];
    store.destroy(record);
    store.sync();
}

I have verified the record and store exist. The store is of type TreeStore as in the example. If I check the request being sent, it's just []. All I have in my proxy at the moment is this:

var store = Ext.create('Ext.data.TreeStore', {
    storeId : 'treeStore',
    model : 'Task',
    proxy : {
        type : 'ajax',
        // the store will get the content from the .json file
        url : '../resources/data/treegrid.json'
    },
    folderSort : true
});

Clicking delete does not remove the currently selected item. Do I need to set up a proper destroy URL in the proxy, and why is it not sending any details about what needs to be deleted in the request header? There were no other examples of doing CRUD from a tree that I could find.

---

EDIT:

Note that the reason for the confusion of using store.destroy(record) was that Ext.data.Store has a method remove(record) but Ext.data.TreeStore does not. Also, a shorthand approach to destroying is record.destroy() rather than record.remove(true).

Note however that I received errors doing record.destroy() or record.remove(true). Presumably the store needs to retain the nodes to send across as JSON, so use record.remove() instead.

Answer 1

Tree store has no method destroy. Since the record is from a treestore, it's decorated with a node interface. So use the remove method ( with the optional destroy).

    var record = tree.getSelectionModel().getSelection()[0];
    record.remove(true);
    store.sync();