1. #1
    Sencha User
    Join Date
    Apr 2012
    Posts
    9
    Vote Rating
    0
    sorin7486 is on a distinguished road

      0  

    Default How to rearrange items in a container with drag and drop.

    How to rearrange items in a container with drag and drop.


    I need to make a list that can be rearranged using drag and drop in a Sencha Touch 1.0 app. So what I did so far is to create a panel with the items list made out of alternating draggable and droppable panels. I can drag an item to a new position and I can get figure out where I need to insert it, but the problem is I can't figure out how to actually move the item within the panel.

    I tried to remove the item and insert it in the new location, but it's a bit slow and it stopped working once I changed the eventTarget on the Draggable object to point to a child of the item(the handle of the item that you have to use in order to drag it around).

    Code:
    var paragraphText = p.el.dom.outerText;
    paragraphPanel.remove(paragraph, true);
    paragraphPanel.insert(dropIndex, createParagraph(paragraphText));
    paragraphPanel.doLayout();


    I also tried not destroying the item and just removing it and inserting it right back in the new possition. This doesn't work at all, as in the drag is reset and nothing happens in the list, even though the code below gets executed.

    Code:
    paragraphPanel.remove(paragraph, false);
    paragraphPanel.insert(dropIndex, paragraph);
    paragraphPanel.doLayout();
    Any suggestions would be appreciated.

  2. #2
    Sencha - Senior Forum Manager mitchellsimoens's Avatar
    Join Date
    Mar 2007
    Location
    Gainesville, FL
    Posts
    37,404
    Vote Rating
    850
    mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute

      0  

    Default


    Looks like the layout never removes the DOM elements for when you remove an item but don't destroy the component.
    Mitchell Simoens @SenchaMitch
    Sencha Inc, Senior Forum Manager
    ________________
    Check out my GitHub, lots of nice things for Ext JS 4 and Sencha Touch 2
    https://github.com/mitchellsimoens

    Think my support is good? Get more personalized support via a support subscription. https://www.sencha.com/store/

    Need more help with your app? Hire Sencha Services services@sencha.com

    Want to learn Sencha Touch 2? Check out Sencha Touch in Action that is in print!

    When posting code, please use BBCode's CODE tags.

Thread Participants: 1

Tags for this Thread