0

This is my code for a TextArea that auto resize (I'm using Errai so TextArea is injected btw):

@Inject
@DataField
TextArea content;

@AfterInitialization
public void afterInit(){
content.getElement().setAttribute("wrap","off");

        content.addKeyUpHandler(new KeyUpHandler() {
            @Override
            public void onKeyUp(KeyUpEvent event) {
                $(content)
                        .css("overflow-y", "hidden")
                        .css("overflow-x", "auto")
                        .css(CSS.HEIGHT, "300px")
                        .css(CSS.HEIGHT, DOM.getElementPropertyInt(content.getElement(),"scrollHeight")  + "px");
            }
        });

        content.addValueChangeHandler(new ValueChangeHandler<String>() {
            @Override
            public void onValueChange(ValueChangeEvent<String> event) {
                $(content)
                        .css("overflow-y", "hidden")
                        .css("overflow-x", "auto")
                        .css(CSS.HEIGHT, "300px")
                        .css(CSS.HEIGHT, DOM.getElementPropertyInt(content.getElement(),"scrollHeight")  + "px");
            }
        });

        content.addMouseUpHandler(new MouseUpHandler() {
            @Override
            public void onMouseUp(MouseUpEvent event) {
                $(content)
                        .css("overflow-y", "hidden")
                        .css("overflow-x", "auto")
                        .css(CSS.HEIGHT, "300px")
                        .css(CSS.HEIGHT, DOM.getElementPropertyInt(content.getElement(),"scrollHeight")  + "px");
            }
        });
}

This code works fine with few problems I want to take note:

  • The code does not look elegant, code is redundant, is there a way to simplify it
  • Typing makes the TextArea auto-grow, also CTRL + V command also makes it grow with the content, however RIGHT-CLICK + Paste item in context menu does not auto grow you have to click again the TextArea the second time to trigger it to grow.
  • When the TextArea grows it's quite steep, is it possible to have a smooth effect?
quarks
  • 33,478
  • 73
  • 290
  • 513
  • You have asked this question [GWT - Autogrow TextArea](http://stackoverflow.com/questions/22388444/gwt-autogrow-textarea/22389815#22389815) in GWT. Do you want to try it with GwtQuery also? – Braj Mar 16 '14 at 07:39
  • @manolo-carrasco-monino I hope you can check this question. Cheers! – quarks Mar 18 '14 at 09:17
  • @Braj this is a different approach – quarks Mar 19 '14 at 23:03

0 Answers0