2010-04-12 61 views
1

我建立了一個triggerField,當我按下它時,我想要一個彈出窗口,它被附加到觸發字段中的按鈕上(所以當我點擊其他任何地方時它將消失,當我點擊按鈕就像一個日期選擇器彈出)建立一個帶彈出窗口的觸發字段

我以某種方式設法做類似的事情與一個Ext.window但偏移量和位置不匹配。

這一切應該包含在一個行編輯器中。 我的代碼:

new Ext.grid.GridPanel({ 
     store: Store, 
     region:'center', 
     height:150, 
     //minWidth:700, 
     autoScroll:true, 
     listeners:{}, 
     plugins:[new Ext.ux.grid.RowEditor()], 
     tbar: [{ 
      iconCls: 'icon-user-add', 
      text: ' hinzufügen', 
      handler: function(){ 
       alert("abc"); 
      } 
     },{ 
      ref: '../removeBtn', 
      iconCls: 'icon-user-delete', 
      text: 'löschen', 
      disabled: true, 
      handler: function(){ 
       editor.stopEditing(); 
       var s = grid.getSelectionModel().getSelections(); 
       for(var i = 0, r; r = s[i]; i++){ 
        store.remove(r); 
       } 
      } 
     }], 
     columns: [{ 
      header: 'Monate', 
      dataIndex: 'MONAT', 
      width: 50, 
      sortable: true, 
      editor: 
       new Ext.form.TriggerField({"id":"EditorMonate",items:[], 
        "onTriggerClick":function(thiss){ 
        if(!Ext.getCmp("autoWMonate")){ 
        var monate=new Ext.Window({"x":Ext.getCmp("EditorMonate").x,closeAction:"hide",width:275,id:"autoWMonate",layout:"table",layoutConfig: {columns: 10}}); 
        var text; 
        for(var mon=1;mon<13;mon++){ 
        text=mon; 
        mon?mon:text="0"; 
        if(mon<10) 
         text="0"+mon; 
          monate.items.add(
new Ext.Button({cls:"x-btn",value:parseInt(text),selected:true,"text":text,id:text 
         }}}));} 
        }    Ext.getCmp("autoWMonate").hidden?Ext.getCmp("autoWMonate").show():Ext.getCmp("autoWMonate").hide(); 
       }}) 
     } 
     }] 
    }) 

回答

0

我做了這樣的事情通過查看日期選取器的代碼和推廣的想法有 - 使用菜單組件的彈出行爲,並把任何你喜歡載單個組件由菜單。

1

問題sovled有:

{ 
    header: 'WochenTage', 
    dataIndex: 'WOCHE', 
    width: 100, 
    sortable: true, 
    editor: new Ext.form.TriggerField({ 
    onTriggerClick: function(e) { 
     if (!this.menu) { 
     this.menu = new Ext.menu.Menu({ 
      items:[{xtype:"label",text:"1"},{xtype:"label",text:"2"}] 
      // the items should have event listeners that set the field value accordingly 
     }); 
     } 
     // here you would want to sync the items in the menu with the field value (this.getValue()) 
     // before you show the menu -- keep in mind that the menu and its children might not be rendered yet 
     this.menu.showAt(e.getXY()); // or this.menu.show(this.getEl(), 'tl-bl?'); 
    } 
    }) 
} 
相關問題