GWT SelectBox ChangeHandler event doesn't work

Question

Sample:

private Widget getSelectBox() {
  HorizontalPanel hPanel = new HorizontalPanel();
  hPanel.setSpacing(20);
  final ListBox dropBox = new ListBox(false);
  String[] listTypes = {"1", "2", "3"};
  for (int i = 0; i < listTypes.length; i++) {
    dropBox.addItem(listTypes[i]);
  }
  dropBox.ensureDebugId("cwListBox-dropBox");
  dropBox.getElement().setId("cms-dropBox");
  VerticalPanel dropBoxPanel = new VerticalPanel();
  dropBoxPanel.setSpacing(4);
  dropBoxPanel.add(dropBox);
  hPanel.add(dropBoxPanel);
  dropBox.addChangeHandler(new ChangeHandler() {
    public void onChange(ChangeEvent event) {
      Window.alert("change fired");
      dropBox.addItem("else");
      consoleLog("selected: "+ dropBox.getSelectedIndex());
    }
  });  
  return hPanel;
}

ChangeHandler isn't working. Although in the official example it works fine (http://samples.gwtproject.org/samples/Showcase/Showcase.html#!CwListBox ). But it isn't working in this code. There are no errors.

DOM.sinkEvents((com.google.gwt.user.client.Element) dropBox.getElement(), Event.ONCHANGE );
DOM.setEventListener((com.google.gwt.user.client.Element) dropBox.getElement(), new EventListener() {
    @Override
    public void onBrowserEvent(Event event) {
        if (DOM.eventGetType(event) == Event.ONCHANGE) {
              Window.alert("change fired");
              dropBox.addItem("who");
              consoleLog("selected: "+ dropBox.getSelectedIndex());                                        
        }                                             
    }
}); 

This way doesn't work neither.

upd: all works in MainEntryPoint class, but need panel.add(new SomeClass().getWidget()), and this isn't work

Answer 1

the reason for not working eventListener: inattention.

don't override html content of ready DOM like container.getElement().setInnerHTML(container.getElement().getInnerHTML()+"<div>somehtml</div>"); after adding any widget with a eventListener

Answer 2

So, you just need to hook up a ListBox ChangeEvent from another class. You can do this in a lot of ways. Here are two easy methods.

Let's assume that a ListBox is defined in class A and you need a handler in class B.

• First method: expose a ListBox from class A and use it in class B to set up handler.
• Second method: add a public method in class A that sets a handler on a ListBox, this will be used in class B.

You will need to pass an instance of class A to the constructor of class B.

---

public class A {
    private ListBox dropBox;

    public A() {
        // constructor - set up dropBox
        ...
    }

    // first method - expose a dropBox
    public ListBox getDropBox() {
        return dropBox;
    }

    // second method - allow external handlers
    public HandlerRegistration addListBoxChangeHandler(ChangeHandler handler) {
        return dropBox.addChangeHandler(handler);
    }
}

public class B {
    private A instanceOfClassA;

    public B(A instanceOfClassA) {
        // constructor
        this.instanceOfClassA = instanceOfClassA;
        ...

        // first method - dropBox is exposed in class A
        instanceOfClassA.getDropBox().addChangeHandler(handler);

        // second method - add external handler
        instanceOfClassA.addListBoxChangeHandler(handler);
    }
}

The second method is more elegant.