Page 1 of 2 12 LastLast
Results 1 to 10 of 12

Thread: Dynamically adding and removing a form field

  1. #1
    Ext User
    Join Date
    Jun 2010
    Posts
    8
    Vote Rating
    0
      0  

    Default Dynamically adding and removing a form field

    I have an application where I have a nice big grid of fields.

    I'd like to edit those fields.

    I've got to the point where I can move around the fields using the cursor keys and start editing by typing.

    When the user first starts typing I'm creating a TextField and inserting it in the appropriate spot.

    Now comes the tricky part, when the user is done editing (they have hit enter) I want to remove the TextField from the DOM. I could call destroy, but I'd much rather reuse the TextField next time, rather than recreate it from scratch.

    I can't see an easy way to do this, I can get naughty and call remove on the fields underlying Element and it will be removed from the DOM. Then I need to start mantaining the rendered flag, then the event handlers get themselves in a not. Basically it starts to feel hard, which is not what I've been told Ext is about.

    Am I missing something? Does Ext consider reuse of FormFields or am I coding in a throw away world?

  2. #2
    Sencha Premium Member
    Join Date
    Sep 2007
    Posts
    13,976
    Vote Rating
    131
      0  

    Default

    Are you sure you use GXT? there is nothing like destroy in GXT.

  3. #3
    Ext User
    Join Date
    Jun 2010
    Posts
    8
    Vote Rating
    0
      0  

    Default oops

    my bad. Will repost more sensibly.

  4. #4
    Sencha Premium Member
    Join Date
    Sep 2007
    Posts
    13,976
    Vote Rating
    131
      0  

    Default

    i will move it, no need to repost

  5. #5
    Sencha - Ext JS Dev Team Animal's Avatar
    Join Date
    Mar 2007
    Location
    Bédoin/Redwood City
    Posts
    30,644
    Vote Rating
    62
      0  

    Default

    Removing (with autoDestroy as false) does not remove the item's rendered Element from the DOM.

    You will have to than add it to a hidden, offscreen Container, and call doLayout on that Container to force the item's Element to be re-homed into the hidden Container.
    Longtime Sencha geek. Outspoken advocate of pure Javascript Views. Posts my own opinions.

  6. #6
    Ext User
    Join Date
    Jun 2010
    Posts
    8
    Vote Rating
    0
      0  

    Default

    =)

    So I've got

    option 1 - open can of worms
    option 2 - just destroy and recreate every time.

  7. #7
    Sencha - Ext JS Dev Team Animal's Avatar
    Join Date
    Mar 2007
    Location
    Bédoin/Redwood City
    Posts
    30,644
    Vote Rating
    62
      0  

    Default

    option 3 - remove and add to a Container which is hidden.

    Much more efficient.
    Longtime Sencha geek. Outspoken advocate of pure Javascript Views. Posts my own opinions.

  8. #8
    Ext User
    Join Date
    Jun 2010
    Posts
    8
    Vote Rating
    0
      0  

    Default

    So add it once to a div or something and then just shuffle the div about? I'm not a huge fan of having a bunch of stuff in my DOM on the off chance I might need it some day, but it will most likely work... I'll have a play.

  9. #9
    Sencha - Ext JS Dev Team Animal's Avatar
    Join Date
    Mar 2007
    Location
    Bédoin/Redwood City
    Posts
    30,644
    Vote Rating
    62
      0  

    Default

    I thought you said "I'd much rather reuse the TextField next time, rather than recreate it from scratch."
    Longtime Sencha geek. Outspoken advocate of pure Javascript Views. Posts my own opinions.

  10. #10
    Ext User
    Join Date
    Jun 2010
    Posts
    8
    Vote Rating
    0
      0  

    Default

    condedev1 - Nice hijack.

    Animal - You don't need to leave something in the DOM to reuse it. I usually create my objects, add them to the DOM when I'm using them, then pull them out and leave them sitting in memory, waiting to be re-inserted.

Page 1 of 2 12 LastLast

Similar Threads

  1. Adding and Removing Accordion Elements Dynamically
    By ogradyjd in forum Ext 2.x: Help & Discussion
    Replies: 16
    Last Post: 12 Dec 2008, 8:59 AM
  2. [2.2] Dynamically adding/cloning/removing fields of a form
    By arnold in forum Community Discussion
    Replies: 2
    Last Post: 7 Nov 2008, 12:09 AM
  3. dynamically adding and removing menus
    By holli in forum Ext 1.x: Help & Discussion
    Replies: 0
    Last Post: 23 Oct 2007, 2:10 PM
  4. Dynamically adding / removing checkboxes
    By jeffita in forum Ext 1.x: Help & Discussion
    Replies: 0
    Last Post: 9 Aug 2007, 12:30 PM
  5. Adding and Removing rows dynamically from a grid
    By sonic64 in forum Ext 1.x: Help & Discussion
    Replies: 28
    Last Post: 9 Apr 2007, 8:51 PM

Posting Permissions

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