开发者

GWT: creating a text widget for highly customized data entry

开发者 https://www.devze.com 2023-01-18 18:48 出处:网络
I\'m trying to implement a kind of \"guided typing\" widget for data entry, in which the user\'s text entry is highly controlled and filtered. When the user types a particular character I need to inte

I'm trying to implement a kind of "guided typing" widget for data entry, in which the user's text entry is highly controlled and filtered. When the user types a particular character I need to intercept and filter it before displaying it in the widget. Imagine if you will, a Unix shell embedded as a webapp; that's the kind of thing I'm trying to implement. I've tried two approaches.

In the firs开发者_运维技巧t, I extend a TextArea, and add a KeyPressHandler to filter the characters. This works, but the browser-provided spelling correction is totally inappropriate, and I don't see how to turn it off. I've tried:

DOM.setElementProperty(textArea.getElement(), "spellcheck", "false");

But that seems to have no effect- I still get the red underlines over "typos".

In the second approach I use a FocusWidget to get KeyPress events, and a separate Label or HTML widget to present the filtered characters back to the user. This avoids the spelling correction issue, but since the FocusWidget is not a TextArea, the browser tends to intercept certain typed characters for internal use; e.g. FireFox will use the "/" character to begin a "Quick Find" on the page, and hitting Backspace will load the previous web page.

Is there a better way to accomplish what I'm trying to do?


You might just be able to use event.preventDefault() on your keypress events to avoid these browser behaviors. Otherwise, maybe a hybrid of the two approaches? Have a hidden TextArea with focus, accepting key events, and then post the typed characters to a separate Label.


There is no specific GWT method on TextBox for this, but this simple line of GWT code fixes the problem for Chrome (for other browsers, YMMV - it may depend upon how completely they implement HTML5) by setting an attribute on the underlying input element:

myTextBox.getElement().setAttribute("spellCheck", "false");

Perhaps this attribute is a relatively new feature.

0

精彩评论

暂无评论...
验证码 换一张
取 消