1. #1
    Ext User
    Join Date
    Apr 2010
    Posts
    6
    Vote Rating
    0
    kadser is on a distinguished road

      0  

    Question Drag 'n' Drop in scrolling div results in invalid drop

    Drag 'n' Drop in scrolling div results in invalid drop


    Hi there
    I came across an issue which I thought would be pretty common, but surprisingly, google and the search of this forum turned up nothing.
    Soo.. the problem is that dropping in a scrolling div (css: overflow: scroll; ) doesn't work as expected.
    I added the drag element to the div and dropping in its visible area works just fine, but as soon as I drop it outside that area (so that one would first have to scroll to see it), it results in an invalid drop even if it's still in the drop-target-div
    To better show what I mean:


    Now, how do I fix that without just making everything a drop target or redirecting onInvalidDrop to onDragDrop (which would be ugly)?

    A running example of the problem is attached (just set <path to extjs> in the header of the html)

    A related problem which is not that important but I'll ask anyway: Is there a way to restrict the drag proxy to the div in a way that scrolling is supported? When I use DDProxy.constrainTo(the_div);, it blocks at the top and the left, as it should, but also at the right and the bottom where it should scroll..
    Attached Files

  2. #2
    Ext User
    Join Date
    Apr 2010
    Posts
    6
    Vote Rating
    0
    kadser is on a distinguished road

      0  

    Default


    oh dirt - I only see just now that I accidently put it in Ext 3.0 - would a mod be so nice to move it to 2.0 (we actually have 2.2.1) please?

  3. #3
    Ext User
    Join Date
    Apr 2010
    Posts
    6
    Vote Rating
    0
    kadser is on a distinguished road

      0  

    Default


    I now manually stretched the div by adding a 1px-inner-div at position 10000x1000 and converted that to Ext: http://blog.davglass.com/files/yui/dd15/ This works, but is just a workaround, so if someone would know a proper way (so I still could have an "expanding on demand" scrolling div instead of one with a fixed size), I would appreciate it

  4. #4
    Ext User
    Join Date
    May 2009
    Posts
    1
    Vote Rating
    0
    devsoufiane is on a distinguished road

      0  

    Default


    I have the same problem , just try to add on top head of your script :

    Ext.override(Ext.dd.DragDrop, {
    handleMouseDown: function(e, oDD){

    if (this.primaryButtonOnly && e.button != 0) {
    return;
    }

    if (this.isLocked()) {
    return;
    }

    this.DDM.refreshCache(this.groups);

    var pt = new Ext.lib.Point(Ext.lib.Event.getPageX(e), Ext.lib.Event.getPageY(e));
    if (1==0 ) {
    } else {
    if (this.clickValidator(e)) {

    // set the initial element position
    this.setStartPosition();


    this.b4MouseDown(e);
    this.onMouseDown(e);

    this.DDM.handleMouseDown(e, this);

    this.DDM.stopEvent(e);
    } else {


    }
    }
    },
    });

  5. #5
    Ext User
    Join Date
    Apr 2010
    Posts
    6
    Vote Rating
    0
    kadser is on a distinguished road

      0  

    Default


    Hi devsoufiane
    This doesn't seem to change anything for me, sadly, I still get invalid drops for everything inside the div but outside the view.
    I'm actually not quite sure what your code is supposed to do...

    Thanks anyway. I think I continue to use the other solution.

Thread Participants: 1

Tags for this Thread