Skip to main content
Known Participant
November 7, 2011
Answered

onChange and DropDownList's - event not being dispatched

  • November 7, 2011
  • 1 reply
  • 2716 views

I can't get an onChange event to fire when making a ListItem selection in a DropDownList control. Am I doing something wrong? (I'm running XP Pro 32bit)

    

   
     var dlg = new Window('dialog');
     var pnl = dlg.add('panel');

     var myDDList1 = pnl.add('dropdownlist',undefined,['one', 'two', 'three'], {name: 'ddList1'});
     myDDList1.addEventListener('change', myFunction);
     var myDDList2 = pnl.add('dropdownlist',undefined,['one', 'two', 'three'], {name:'ddList2'});
     myDDList2.addEventListener('change', myFunction);
     var myDDList3 = pnl.add('dropdownlist',undefined,['one', 'two', 'three'], {name:'ddList3'});
     myDDList3.addEventListener('change', myFunction);

      function myFunction(ev)

     {
          var ddl = ev.target;
          var props = ddl.properties;

          if(props.hasOwnProperty('name'))
          {
               switch(props.name)
               {

                    case 'ddList1':
                        alert ('change made in ddList1');
                    break;

                    case 'ddList2':
                        alert ('change made in ddList2');
                    break;

                    case 'ddList3':
                        alert ('change made in ddList3');
                    break;
               }
          }
     
          ddl = null;
          props = null;

     };    

     dlg.show();

This topic has been closed for replies.
Correct answer c.pfaffenbichler

Does this work?

var dlg = new Window('dialog');

var pnl = dlg.add('panel');

var myDDList1 = pnl.add('dropdownlist',undefined,['one', 'two', 'three'], {name: 'ddList1'});

myDDList1.onChange = myFunction;

var myDDList2 = pnl.add('dropdownlist',undefined,['one', 'two', 'three'], {name:'ddList2'});

myDDList2.onChange = myFunction;

var myDDList3 = pnl.add('dropdownlist',undefined,['one', 'two', 'three'], {name:'ddList3'});

myDDList3.onChange = myFunction;

function myFunction() {

          alert (this.properties.name);

     };    

dlg.show();

1 reply

c.pfaffenbichler
Community Expert
Community Expert
November 8, 2011

Not sure about your function, but

     myDDList1.onChange = myFunction;

should start it.

c.pfaffenbichler
Community Expert
c.pfaffenbichlerCommunity ExpertCorrect answer
Community Expert
November 8, 2011

Does this work?

var dlg = new Window('dialog');

var pnl = dlg.add('panel');

var myDDList1 = pnl.add('dropdownlist',undefined,['one', 'two', 'three'], {name: 'ddList1'});

myDDList1.onChange = myFunction;

var myDDList2 = pnl.add('dropdownlist',undefined,['one', 'two', 'three'], {name:'ddList2'});

myDDList2.onChange = myFunction;

var myDDList3 = pnl.add('dropdownlist',undefined,['one', 'two', 'three'], {name:'ddList3'});

myDDList3.onChange = myFunction;

function myFunction() {

          alert (this.properties.name);

     };    

dlg.show();

JJ_FulksAuthor
Known Participant
November 8, 2011

Thank you, that works perfectly. Is it because invoking the function using this method


myDDList1.onChange = myFunction;

the onChange Event actually contains a copy of myFunction(), and the this keyword used in the function is a reference to the element the onChange event is registered to; in this case myDDList1? Whereas, invoking the function using this method

myDDList1.addEventListenter('change', myFunction);

myFunction() is not copied, but only referred to when the onChange event happens? Still not sure why it wouldn't work, though. Mousedown, mouseover, and other Events trigger the function using this method and event.target can be used to refer to the element that triggered the Event.

Thanks again!