1. #1
    Sencha User
    Join Date
    Aug 2008
    Location
    Gothenburg
    Posts
    157
    Vote Rating
    2
    Dr. Flink is on a distinguished road

      0  

    Default Reorder/DnD items in a Ext.menu.Menu

    Reorder/DnD items in a Ext.menu.Menu


    I'm using the Ext.ux.StartMenu (from the web desktop sample) which is extending the Ext.menu.Menu.

    Is it possible to reorder the menu items using drag/drop? I'm reading in the DD section, but don't have a clue about how this can be done.
    Any examples or tips on how to do this?

    Best regards
    Rickard

  2. #2
    Sencha User
    Join Date
    Aug 2008
    Location
    Gothenburg
    Posts
    157
    Vote Rating
    2
    Dr. Flink is on a distinguished road

      0  

    Default


    *bump*

  3. #3
    Sencha User
    Join Date
    Aug 2008
    Location
    Gothenburg
    Posts
    157
    Vote Rating
    2
    Dr. Flink is on a distinguished road

      0  

    Default


    I'm finally getting somewhere .

    My only (*knocks on wood*) problem now is to be able to drag the list item when I'm pressing down the mouse on the anchor node child (<li><a>I'm the child</a></li>).

    Is it possible, and if so how, to hook the StartMenuDDProxy object to the anchor node instead but be moving the list node?

    Code:
    var StartMenuDDProxy = function(config) {
        StartMenuDDProxy.superclass.constructor.apply(this, arguments);
    };
    
    Ext.extend(StartMenuDDProxy, Ext.dd.DDProxy, {
        startDrag: function(x, y) {
            var dragEl = Ext.get(this.getDragEl());
            var el = Ext.get(this.getEl());
            dragEl.applyStyles({
                border: '',
                'z-index': 99999999
            });
        },
    
        onDragEnter: function(e, targetId) {
            var target = Ext.get(targetId);
            if(target.dd instanceof StartMenuDDProxy) {
                this._target = target;
                this.updateTargetPosition();
            }
        },
    
        updateTargetPosition: function() {
            var _box = this._target.getBox();
            this._crossOver = {
                x: (this._target.getLeft() + (_box.width / 2)),
                y: (this._target.getTop() + (_box.height / 2))
            }
        },
    
        onDragOver: function(e, targetId) {
            if(this._target) {
                var el = Ext.get(this.getEl());
                if(el.id != this._target.id) {
                    if(this._placement == "before") {
                        el.insertBefore(this._target);
                    }
                    else {
                        el.insertAfter(this._target);
                    }
                    this.updateTargetPosition();
                    var xy = e.getXY();
                    this._placement = (xy[1] < this._crossOver.y) ? "before" : "after";
                }
            }
        },
    
        endDrag: function() {
            var el = Ext.get(this.getEl());
            el.applyStyles({
                position: '',
                width: ''
            });
            this._target = null;
            this._placement = null;
            this._crossOver = null;
        }
    });
    
    Ext.ux.StartMenuDD = function() {
        return {
            init: function() {
                var menu = Ext.get('start-menu-modules');
                var items = menu.select('li.x-menu-list-item', true);
    
                items.each(function(item) {
                    item.dd = new StartMenuDDProxy(item.id, 'start-menu-module-group');
                });
            }
        };
    }();
    [UPDATE]
    Reading about Ext.dd.DDProxy and setHandleElId in the docs, this should be default?
    Clicking anywhere in the content area would normally start the drag operation.

  4. #4
    Sencha User
    Join Date
    Aug 2008
    Location
    Gothenburg
    Posts
    157
    Vote Rating
    2
    Dr. Flink is on a distinguished road

      0  

    Default


    Does anybody know how to enable to start the drag operation by clicking anywhere in the content area? I guess this is supposed to be default, but what ever I do, I cant make it work. I even tried removing all the overided functions, but I have to click the li-tag to start the drag. I want to start the drag when holding down mouse button on a link tag.
    Code:
    <ul>
        <li><a>Link 1</a></li>
        <li><a>Link 2</a></li>
        <li><a>Link 3</a></li>
    </ul>

  5. #5

  6. #6
    Sencha User
    Join Date
    Aug 2008
    Location
    Gothenburg
    Posts
    157
    Vote Rating
    2
    Dr. Flink is on a distinguished road

      0  

    Default


    Thank you Animal! I totally missed those lines. Thought I had some errors in my code when I read the quote I mentioned earlier.

    Thanks!

Thread Participants: 1

film izle

hd film izle

film sitesi

takipci kazanma sitesi

takipci kazanma sitesi

güzel olan herşey

takipci alma sitesi

komik eğlenceli videolar