2013-11-15 3 views
0

Я провел последние 3 часа, пытаясь создать меню внутри сетки (см. Img: Menu inside a grid). Но для жизни я не могу заставить handlers работать внутри меню.Создайте меню внутри сетки, которая открывается onClick

Редактировать (уточнять): Я хочу иметь больше места для значков действий внутри сетки, в каждой строке записи. Поэтому, чтобы создать дополнительное пространство, я хочу иметь меню onClick внутри каждой строки сетки (см. Изображение), это позволит мне добавлять значки с неограниченными действиями в раскрывающееся меню.

Я создал меню, как это (я думаю, что это не правильно, но я не знаю, как еще это сделать):

ux.RGridPanel = Ext.extend(Ext.grid.GridPanel, { 
    newMenu: new Ext.menu.Menu({ 
     id: 'mainMenu', 
     style: { 
      overflow: 'visible'  // For the Combo popup 
     }, 
     items: [ 
      { 
       text: 'I like Ext', 
       checked: true  // when checked has a boolean value, it is assumed to be a CheckItem 
      }, 
      { 
       iconCls: 'sitemap_16', 
       text: 'Test 2', 
       tooltip: '', 
       handler: function(a,b){ 
        console.log(this.ownerCt); //All this stuff is not working 
        console.log(a); 
        console.log(this.parent); 
        this.parent.showSelectDialog //This is what is causing me issues, this won't work. 
       } 
      }, 
      [...] 
     ] 
    }); 

Я пытаюсь вызвать обработчик внутри RGridPanel:

showSelectDialog: function(grid, rowIndex, colIndex) {} 

Я хочу использовать хорошие методы внутри RGridPanel поэтому мне не нужно передавать параметры. Может ли кто-нибудь указать мне в правильном направлении, чтобы исправить это ?!

EDIT ::: Я пришел несколько дальше от себя, используя это внутри GridPanel:

loadMenu: function(){ 
    return new Ext.menu.Menu({ 
     scope:this, 
     id: 'mainMenu', 
     style: { 
      overflow: 'visible'  // For the Combo popup 
     }, 
     items: [ 
      { 
       iconCls: 'sitemap_16', 
       text: 'Test 2', 
       handler:this.showSelectImportFileDialog, //this works, but it does not pass the required params 

И

initComponent: function() { 
    this.newMenu = this.loadMenu(); 

А на cog значок:

handler: function (view, record, el, i, e) { 
     view.newMenu.showAt(e.getXY()); 
    }, 

Теперь я могу позвонить showSelectDialog, но параметры по умолчанию ((grid, rowIndex, colIndex) не работают. Потому что я вызываю showSelectDialog из меню.

+0

Что именно вы пытаясь достичь? Согласно вашему изображению, похоже, вы хотите отобразить это меню при нажатии кнопки. Дайте еще некоторые подробности. Панель сетки - это просто сетка. Его не обычное добавление меню внутри него, возможно, вы хотите сделать какую-то панель, а затем вставить сетку и меню внутри нее. Дайте более подробную информацию о целях, которые вам нужны. – sla55er

+0

Или вы хотите сделать некоторые действия при нажатии кнопки меню или? – sla55er

+0

Добавить дополнительную информацию, поможет ли это? –

ответ

0

Когда вы показываете меню, вы можете предоставить некоторые детали, как так:

handler: function(grid, rowIndex, colIndex, item, e) { 
    grid.newMenu.cfg = { 
     grid: grid, 
     rowIndex: rowIndex, 
     colIndex: colIndex, 
     whatever: null 
    }; 
    grid.newMenu.showAt(e.getXY()); 
} 

Затем в обработчике меню можно использовать:

handler: function(){ 
    var menu = this.ownerCt; 
    var cfg = menu.cfg; 

    console.log(cfg); 
} 

Рабочий образец: http://jsfiddle.net/8KJ36/2/

Смежные вопросы