Announcement

Collapse
No announcement yet.
X
  • Filter
  • Time
Clear All
new posts

    focusInItem() issue in IE8

    Hi,

    I have a DynamicForm and 2 text fields in that. To focus to the first textbox I am using <DynamicFormName>.focusInItem("<FieldName>");which is working fine in FireFox. But same code is not working in IE8/Windows7.

    I tried setting DynamicForm.autoFocus to true but that also doesn't help. I have used tabIndex:1 but that also doesn't help.

    The problem is the focus is there in that textbox but the cursor is not visible (i used getFocusItem() to find which is the currently focussed item). Also, when I put some default value to that textbox i can see that cursor perfectly.

    I am using SmartClient7 LGPL version.

    Any ideas ?

    Thanks

    Dev

    #2
    We have noticed similar problem with IE and SmartGWT 2.1 (tried also with 2.2).
    txtItem.focusInItem() does not set the cursor to the text item as it does e.g. in Firefox. According to the developer console, the focus is in the dynamicform in both cases but in IE the cursor is missing. The hint-text disappears in IE as well (as it should when focused).

    We have a Window where we switch between two different layouts (by removing the other with removeItem and adding the other with addItem). Interesting issue here is that the focus is set as supposed in IE as well in case the button is clicked with mouse but not when enter-key is pressed (when focus is in the button). The button has MouseUpHandler and KeyPressHandler that both call the same code (switches the layout and sets the focus to the text item).

    I tried to make a test application but could not make it behave exactly as our real application (there is much more happening there obviously like prefetching images and sending server requests) but anyway when running this with IE 7 this is what happens (at least for us): when the window is loaded for the first time, the focus is in the text field as supposed. Pressing the button changes the view and then we have two options:
    1) click the button with mouse
    2) press tab to set the focus to the button and then press enter
    In this example, neither of the options set the cursor to the text field (as in our application clicking the button with mouse does).

    Any ideas? We have been trying quite many things with the functions related to focus but no luck.

    Code:
    import com.google.gwt.core.client.EntryPoint;
    import com.smartgwt.client.types.KeyNames;
    import com.smartgwt.client.util.SC;
    import com.smartgwt.client.widgets.Button;
    import com.smartgwt.client.widgets.Window;
    import com.smartgwt.client.widgets.events.ClickEvent;
    import com.smartgwt.client.widgets.events.ClickHandler;
    import com.smartgwt.client.widgets.events.KeyPressEvent;
    import com.smartgwt.client.widgets.events.KeyPressHandler;
    import com.smartgwt.client.widgets.events.MouseUpEvent;
    import com.smartgwt.client.widgets.events.MouseUpHandler;
    import com.smartgwt.client.widgets.form.DynamicForm;
    import com.smartgwt.client.widgets.form.fields.TextItem;
    import com.smartgwt.client.widgets.layout.VLayout;
    
    /**
     * Entry point classes define <code>onModuleLoad()</code>.
     */
    public class IEFocusTest implements EntryPoint {
    
      private boolean view1Added = false;
      private boolean view2Added = false; 
      private Window window = new Window();
      private VLayout vl1 = new VLayout();
      private VLayout vl2 = new VLayout();
      private Button button1 = new Button();
      private Button button2 = new Button();
      private Button showConsoleButton = new Button();
      private DynamicForm form = new DynamicForm();
      private TextItem text = new TextItem();
    
      public void onModuleLoad() {
    
        window.setWidth(500);
        window.setHeight(500);
        window.setShowMinimizeButton(false);
        window.setShowCloseButton(false);
        window.setShowModalMask(true);
        window.setIsModal(true);
        button1.setTitle("Show View 2");
        button2.setTitle("Show View 1");
        button1.addKeyPressHandler(new KeyPressHandler() {
          @Override
          public void onKeyPress(KeyPressEvent event) {
            if (event.getKeyName().equals(KeyNames.ENTER)) {
              changeToView2();
            }
          }
        });
        button1.addMouseUpHandler(new MouseUpHandler() {
          @Override
          public void onMouseUp(MouseUpEvent event) {
            changeToView2();
          }
        });
        showConsoleButton.setTitle("Show Console");
        showConsoleButton.addClickHandler(new ClickHandler() {
          @Override
          public void onClick(ClickEvent event) {
            SC.showConsole();
          }
        });
        vl1.setMembersMargin(10);
        vl1.setPadding(10);
        vl1.addMember(showConsoleButton);
        vl1.addMember(button1);
        
        form.setNumCols(1);
        text.setShowTitle(false);
        text.setSelectOnFocus(false);
        form.setFields(text);
        form.setAutoFocus(true);
    //    form.setCanFocus(false);
    //    text.setShowFocused(true);
    
        vl1.addMember(form);
        
        button2.addKeyPressHandler(new KeyPressHandler() {
          @Override
          public void onKeyPress(KeyPressEvent event) {
            if (event.getKeyName().equals(KeyNames.ENTER)) {
              changeToView1();
            }
          }
        });
        button2.addMouseUpHandler(new MouseUpHandler() {
          @Override
          public void onMouseUp(MouseUpEvent event) {
            changeToView1();
          }
        });
        vl2.setPadding(10);
        vl2.addMember(button2);
        
        window.addItem(vl1);
        view1Added = true;
        window.show();
      }
      
      private void changeToView2() {
        if (view1Added) {
          window.removeItem(vl1);
          view1Added = false;
        }
        window.addItem(vl2);
        view2Added = true;
        if (window.isDrawn()) {
          vl2.markForRedraw();
        }
        else {
          window.centerInPage();
          window.draw();
        }
        button2.focus();
      }
      
      private void changeToView1() {
        if (view2Added) {
          window.removeItem(vl2);
          view2Added = false;
        }
        window.addItem(vl1);
        view1Added = true;
        if (window.isDrawn()) {
          vl1.markForRedraw();
        }
        else {
          window.centerInPage();
          window.draw();
        }
        text.focusInItem();
      }
    }

    Comment


      #3
      SmartGWT 2.1, IE 8, FF;

      I have the same problem with both of our smartGWT applications. Under FF focusInItem works fine, but under IE, it seems to be there, but isn't shown, or is shown intermittently.

      is there at least a workaround for this?

      Comment


        #4
        From a look at the test case, the problem appears to be that you can't focus in a component until it is drawn.

        Comment

        Working...
        X