Versions Compared

Key

  • This line was added.
  • This line was removed.
  • Formatting was changed.
Comment: Added warning because I think it's bad practice.
  1. To request focus for a component, we need to use a little JavaScript, we can do so using a behavior:
    Code Block
    borderStylesolid
    public class FocusOnLoadBehavior extends AbstractBehavior
    {
        private Component component;
    
        public void bind( Component component )
        {
            this.component = component;
            component.setOutputMarkupId(true);
        }
    
        public void renderHead( IHeaderResponse iHeaderResponse )
        {
            super.renderHead(iHeaderResponse);
            iHeaderResponse.renderOnLoadJavascript("document.getElementById('" + component.getMarkupId() + "').focus()");
        }
    
        public boolean isTemporary()
        {
            // remove the behavior after component has been rendered       
            return true;
        }
    }  
    
  2. Now, to use that behavior, all we have to do is:
    Code Block
    borderStylesolid
    public class MyPage extends WebPage
    {
      public MyPage()
      {
        Form form = new Form("form");
        TextField field1 = new TextField("field1");
        field1.add(new FocusOnLoadBehavior());
        form.add(field1);
        add(form);
      }
    }
    
  3. !!! Please, never focus a component in "onload" event. It's very annoying if page is not loaded yet but user already scrolling/editing controls and suddenly browser jumps him to some other control. More sensible put the focus() code just after component tag.