CODEWITHSUNDEEP
javascripteventsgwt
Igor Konoplyanko
Igor Konoplyanko

Reputation: 9374

Text box loses focus when DIV is hovered

I have a problem: When I enter a text into suggestion text box, popup panel appears. But when user places mouse over this popup panel with suggestions - text box loses focus.

What should I do to prevent losing focus ?

Example which have the same behaviour: http://demo.raibledesigns.com/gwt-autocomplete/

Thanks for any help.

Update 1

SuggestionMenu which is being shown is extending MenuBar which sets focus for all menu items.

void itemOver(MenuItem item, boolean focus) {
    if (item == null) {
      // Don't clear selection if the currently selected item's menu is showing.
      if ((selectedItem != null)
          && (shownChildMenu == selectedItem.getSubMenu())) {
        return;
      }
    }

    // Style the item selected when the mouse enters.
    selectItem(item);
    if (focus) {
      focus();
    }

    // If child menus are being shown, or this menu is itself
    // a child menu, automatically show an item's child menu
    // when the mouse enters.
    if (item != null) {
      if ((shownChildMenu != null) || (parentMenu != null) || autoOpen) {
        doItemAction(item, false);
      }
    }
  }

It's clear that i cant fix loosing focus. Now question is - how to make on pressing backspace or any key to focus on edit box?

Thanks in advance

Upvotes: 0

Views: 619

Answers (2)

Igor Konoplyanko
Igor Konoplyanko

Reputation: 9374

I found the problem. I have used GWT 1.7.0. - and it's has focus() call in it's source code.

This problem can be solved by updating to GWT v2.

Thanks markovuksanovic for help!

Upvotes: 1

markovuksanovic
markovuksanovic

Reputation: 15906

I guess this is your code? Or is this a snippet from gwt source?

My guess is that this is your custom code... In that case you shouldn't focus the element to style it but instead attach a handler... sth like

public HandlerRegistration addMouseOutHandler(MouseOutHandler handler) {
  return this.addDomHandler(handler, MouseOutEvent.getType());
}
public HandlerRegistration addMouseOverHandler(MouseOverHandler handler) {
  return this.addDomHandler(handler, MouseOverEvent.getType());
}


element.addMouseOutHandler(new MouseOutHandler() {
  public void onMouseOut(MouseOutEvent event) {
    element.removeStyleName(HEADER_STYLE_HOVERING);
  }
});

element.addMouseOverHandler(new MouseOverHandler() {
  public void onMouseOver(MouseOverEvent event) {
    element.addStyleName(HEADER_STYLE_HOVERING);
  }

});

just replace the element with whatever you want to attach the handlers to.

Does this help you?

Upvotes: 1

Related Questions