Могу ли я настроить форму dojo dijit для ComboButton, чтобы сделать onClick или что-то подобное, когда пользователь выбирает значение в выпадающем списке?

Question

Возможно, я использую виджет dojo. Мне просто нужен раскрывающийся список, но в настоящее время у вас есть ComboButton. Могу ли я настроить onClick или onSelect какого-то типа, когда пользователь выбирает опцию в нижнем меню ComboButton? Мой текущий onClick подбирает, когда пользователь нажимает кнопку текстовой области, но не выбирает стрелку вниз. Я хочу выполнить действие onClick или onSelect после того, как пользователь нажимает кнопку со стрелкой вниз, а затем выбирает параметр.

  {id: 'identOpModeId', field: 'identOpMode', name:'OpMode', width: '124px', 
       navigable: true, 
       expandLevel: 'all', 
       widgetsInCell: true, 
       allowEventBubble: true, 
       onCellWidgetCreated: function(cellWidget, cell){ 
        var menuItems = OpModeMenuItems.returnOpModeMenuItems(cellWidget); 
        menuItems.forEach(function (menuItem) 
        { 
         cellWidget.sMenu.addChild(menuItem); 
        }); 
       }, 
       setCellValue: function(one,two,cellWidget){ 
        var rowIndex = cellWidget.cell.row.id; 
        cellWidget.identOpMode.set("label", identMemStore.get(rowIndex).identOpMode); 
       }, 
       getCellWidgetConnects: function(cellWidget, cell){ 
        // return an array of connection arguments 
        return [ 

         // How do I capture the onClick of the dijitArrowButton button?? 

         [cellWidget.identOpMode, 'onClick', function(e){ 
          var rowIndex = cellWidget.cell.row.id; 
          // I do NOT need this line - the drop down menu already sets the value! I just need to update the store!! 
          //cellWidget.identOpMode.set("label", identMemStore.get(rowIndex).identOpMode); 
          identMemStore.data[rowIndex-1].identOpMode = identMemStore.get(rowIndex).identOpMode; 
          // cellWidget.data[rowIndex].identOpMode = identMemStore.get(rowIndex).identOpMode; 
          // Add item to userRowChanges 
          updateRows(rowIndex-1, identGridx.row(rowIndex-1).item()); 
         }] 
        ]; 
       }, 
       decorator: function(){ 
        return [ 
         '<div data-dojo-attach-point="identOpMode" data-dojo-type="dijit/form/ComboButton" >', 
         '<div data-dojo-attach-point="sMenu" data-dojo-type="dijit/Menu"></div></div>' 
        ].join(''); 
       } 

      }, 

Answer 1

Я думаю, что вы ищете это событие OnChange и не OnClick и вы могли бы искать DropDownButton вместо ComboButton, но в любом случае, OnChange является метод, который вы должны искать. Хороший способ зацепить в метод OnChange заключается в использовании «додзё/на» и сделать что-то вроде этого:

on(this.identOpMode, "change", function() { 
    //Do something here 
}); 

В вашей конкретной ситуации, я бы на самом деле изменить [cellWidget.identOpMode, часть «OnClick» в вместо этого вместо «onChange».

Answer 2

Предложение Ричарда на месте. Исходя из его предложения и того, что я узнал, dojo/on является решением коррекции. Вот мое решение, используя dijit/form/ComboButton, хотя в будущем я могу перейти на DropDownBox, пока он работает, поэтому я оставлю его.

Для моего dijit/form/ComboButton я просто добавил код к своему onClick для каждого элемента в списке, чтобы получить данные об изменении.

returnOpModeMenuItems: function (CellWidget) 
{ 
    var menu = []; 
    var labels = ["Label1","Label2","Label3"]; 
    labels.forEach(function (label) 
    { 
     var menuItem = new dijit.MenuItem({ 
      label : label, 
      value : label, 
      onClick : function (value) { 
       CellWidget.identOpMode.set('label', label); 

       var rowIndex = CellWidget.cell.row.id; 
       identMemStore.data[rowIndex-1].identOpMode = label; 

       updateRows(rowIndex-1, identGridx.row(rowIndex-1).item()); 
      } 
     }); 
     menu.push(menuItem); 
    }); 
    return menu; 
} 

Для других виджетов додзе, которые не имеют OnClick-х я использовал следующее:

   { id: 'srcSelVideoFrameRateId', field: 'srcSelVideoFrameRate', name: 'Frame Rate', width: '77px', 
        widgetsInCell: true, 
        navigable: true, 
        setCellValue: function(gridData, storeData, cellWidget){ 
         var rowIndex = cellWidget.cell.row.index()+1; 
         var spinnerVal = sourceSelVideoTabMemStore.get(rowIndex).srcSelVideoFrameRate; 

         cellWidget.srcSelVideoFrameRate.set('style', "width:55px"); 
         cellWidget.srcSelVideoFrameRate.set('value', spinnerVal); 
        }, 
        getCellWidgetConnects: function(cellWidget, cell){ 
         // return an array of connection arguments 
         return [ 
          [cellWidget.srcSelVideoFrameRate, 'onChange', function(e){ 
           var rowIndex = cellWidget.cell.row.id; 
           sourceSelVideoTabMemStore.data[rowIndex-1].srcSelVideoFrameRate = cellWidget.srcSelVideoFrameRate.displayedValue; 

           // Add item to userRowChanges 
           updateRows(rowIndex-1, srcSelVideoGridx.row(rowIndex-1).item()); 
          }] 
         ]; 
        }, 
        decorator: function(){ 
         return "<input data-dojo-type='dijit/form/NumberSpinner' data-dojo-props='smallDelta:0.1, largeDelta:1.0, constraints:{min:1,max:24,places:1,round:false},' data-dojo-attach-point='srcSelVideoFrameRate' />"; 
        } 
       }, 

Для основных текстовых редактируемых полей, которые я использую следующее:

srcSelVideoGridx.edit.connect(srcSelVideoGridx.edit, "onApply", function(cell, success) { 
    var item = cell.row.data(); 
    var rowId = cell.row.id-1; 
    console.log('Row with ID ' + rowId + ' is modified. New value: ' + item); 
    updateRows(rowId, item); 
});