2013-04-16 1 views
1

Я хочу добавить динамические изменения в поле FormPanel, размещенные внутри контейнера (макет: hbox), путем перетаскивания.Динамически добавлять новые поля в существующую панель форм

При удалении панели формы я могу динамически добавлять поля. Но я хочу добавить в положение, где они упали.

var dynamicField = Ext.create('Ext.container.Container',{ 
          layout : 'hbox', 

          items: [{ 
                   xtype:'textfield', 
                   fieldLable:'Test' 

                  }, { 
            xtype : 'image', 
            src : 'images/cancel.png', 
            hidden : true 

            }] 
             }); 


          formPanel.add(dynamicField); 

           // tried dynamicField.showAt(e.getXY()); 

с dynamicField.showAt (e.getXY()) не повез // й объект события

Кто-нибудь может предложить мне, как я могу достичь?

Привет URL

+0

Одна идея разрешить это как, вам нужно разместить несколько заполнителей (Droppable контейнеров) внутри формы панели, так что вы можете заменить контейнер с вновь установленным управлением. – Rency

+0

Как я могу получить контроль и положение? @Rency – url

ответ

0

Существует образец пример для этого обеспечивается сенча, http://docs.sencha.com/extjs/4.1.3/#!/example/dd/dragdropzones.html. В этом мы создаем настраиваемую область с возможностью выбора, и мы можем добавить что-нибудь к этому. проверьте код этого образца.

onNodeDrop : function(target, dd, e, data){ 
     var rowBody = Ext.fly(target).findParent('.x-grid-rowbody-tr', null, false), 
      mainRow = rowBody.previousSibling, 
      h = gridView.getRecord(mainRow), 
      targetEl = Ext.get(target); 

     targetEl.insert(<your control>); // here we can add control directly into it. 
     return true; 
    } 

Для понимания сопротивления & падения, есть хороший гид: http://docs.sencha.com/extjs/4.1.3/#!/guide/drag_and_drop