Question

我正试图在beforenodedrop事件中调用ajax，并且当成功时，我想继续操纵树。但事件中止了。如何在beforenodedrop中调用ajax。

感谢您的帮助。

我的代码在这里：

        // Moving nodes from data grid to tree
        beforenodedrop : {
            fn : function(e) {
                e.cancel = true;
                enableBtnEditAndDelete(false);//Disabling those btns edit and delete from grid toolbar
                // e.data.selections is the array of selected records from grid
                if (Ext.isArray(e.data.selections)) {
                    // setup dropNode (it can be array of nodes)
                    e.dropNode = [];

                    if(e.target.id != this.root.id) {
                        processBarWin.show();
                        var newParentId = e.target.leaf ? e.target.parentNode.attributes.idFolder : e.target.attributes.idFolder;
                        var idsToUpdate = '';
                        //Obj to log
                        var objLog = document.getElementById('log');
                        for ( var i = 0; i < e.data.selections.length; i++) {
                            // get record from selectons
                            var r = e.data.selections[i];
                            idsToUpdate += i > 0 ? ', ' + r.get('id') : r.get('id');

                            nodesToCreate[i] = this.loader.createNode({
                                text : r.get('description'),
                                leaf : true,
                                editable: false,
                                idIdea : r.get('id'),
                                description : r.get('description'),
                                content : r.get('content'),
                                idFolder : r.get('idFolder'),
                                insertDate : r.get('insertDate'),
                                updateDate : r.get('updateDate'),
                                qtip : r.get('content').substring(0, 50) + "..."
                            });

                        }
                        objLog.innerHTML = objLog.innerHTML + "after for<br />";
                        // reset cancel flag, permit to drop items
                        e.cancel = false;
                        for ( var i = 0; i < e.data.selections.length; i++) {
                            // get record from selectons
                            var r = e.data.selections[i];
                            // create node from record data

                            e.dropNode.push(this.loader.createNode({
                                text : r.get('description'),
                                leaf : true,
                                editable: false,
                                idIdea : r.get('id'),
                                description : r.get('description'),
                                content : r.get('content'),
                                idFolder : r.get('idFolder'),
                                insertDate : r.get('insertDate'),
                                updateDate : r.get('updateDate'),
                                qtip : r.get('content').substring(0, 50) + "..."
                            }));
                        }
                        Ext.Ajax.request({
                            url: 'Action/deuErro.php',
                            method: 'POST',
                            params: {
                                action: 'updateIdeaParent',
                                ids : idsToUpdate,
                                idFolder : newParentId
                            },
                            success: function(){
                                objLog.innerHTML = objLog.innerHTML + "success<br />";
                                for ( var i = 0; i < e.data.selections.length; i++) {
                                    var r = e.data.selections[i];
                                    gridStore.remove(r);
                                }
                                processBarWin.hide();
                            },
                            failure: function(){
                                objLog.innerHTML = objLog.innerHTML + "failure<br />";
                                processBarWin.hide();
                                yaMsgError(a.result.errors.title, a.result.errormsg);
                                return false;
                            }
                        });
                    } else {
                        yaMsgWarn(msgActionNotAllowed);
                        return false;
                    }
                } else { // from tree, not from the grid
                    //nothing here
                }
                // We want Ext to complete the drop, thus return true
                return true;
            }
        }

最诚挚的问候，蒂亚戈

Answer 1

从@ innerJL的评论中添加

您可以将Ajax移动到'nodedrop'事件或者为notifyDrop函数创建一个拦截器并在那里操纵你的数据。

nodedrop事件示例：

tree.on('nodedrop', function (drop) {
    Ext.Ajax.request({
       url: '....',
       method: 'POST',
       success: function () {
           //create new node in the tree.
       },
       failure: function () {
           //do nothing.
       }
    });
}, this);

拦截器示例：

tree.dropTarget.notifyDrop = tree.dropTarget.notifyDrop.createInterceptor(function (dragSource, event, data) {

    //show a loadmask on your tree.
    //manipulate your data if necessary

    // do your ajax load
    Ext.Ajax.request({
       url: '....',
       method: 'POST',
       success: function () {
           // retrieve your data and manipulate it. 
           // or maybe you want to create an event and fire it here and pass the data so yo can add a node at a later stage in your flow?
           return true;    // returning true will proceed with the drop 
       },
       failure: function () {
           //do nothing.
           return false;   // returning false will cancel the drop
       }
    });

});

'notifyDrop'没有文档，因此您需要自己探索ExtJS代码。

ExtJS - 如何在beforenodedrop Ext.tree.TreePanel事件中调用ajax

1 个答案: