Results 1 to 2 of 2

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

  1. #1
    Sencha User
    Join Date
    Apr 2012
    Posts
    9
    Vote Rating
    0
      0  

    Default 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 - Sr Software Engineer mitchellsimoens's Avatar
    Join Date
    Mar 2007
    Location
    Gainesville, FL
    Posts
    39,556
    Vote Rating
    1272
      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 @LikelyMitch
    Sencha Inc, Senior Software Engineer
    ________________
    Learn BBCode and use it! Checkout the CODE tag!

    Check out my GitHub, lots of nice things for Ext JS and Sencha Touch
    https://github.com/mitchellsimoens

Tags for this Thread

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •