In Ext js, how to store the tree's nodes' info (i.e. tree structure) on drop operation (i.e. after changing the tree structure)?

Question

I'm new at Ext JS. I have created a tree structure and I am loading the tree store using ajax with the json data from .php file. When I drag any node and drop on some other node, this functionality visibly works properly, but after refreshing the page, it reloads earlier structure (obvi as I'm not storing the new structure). I want to store this changed structure of tree. Please help with code or links. My ode snippet for tree store n tree panel:

    var store = Ext.create('Ext.data.TreeStore', {
        proxy: {
            type: 'ajax',
            api: {
                read : 'jsonData.php'
            }
        },
        writer: {
            type: 'json',
            writeAllFields: true,
            encode: false
        },
        autoSync:true
    });


    Ext.create('Ext.tree.Panel',{
        renderTo : Ext.getBody(),
        title : 'My tree',
        height : 500,
        width : 200,
        store : store,
        rootVisible : true,
        viewConfig: {
            plugins: {
                ptype: 'treeviewdragdrop'
            }
        }  
    });

jsonData.php contains an array which I am json encoding and sending.