代码之家  ›  专栏  ›  技术社区  ›  Jla

GWT文本框上的即时值更改处理程序

  •  25
  • Jla  · 技术社区  · 16 年前

    我想更新一个文本字段时,立即在GWT文本框中键入。我的问题是ValueChangeEvent和ChangeEvent处理程序只有在TextBox失去焦点时才会触发。我考虑过使用KeyPressEvent,但是在用鼠标执行复制粘贴时什么也不会发生。

    最简单的方法是什么?

    6 回复  |  直到 16 年前
        1
  •  35
  •   z00bs    14 年前

    你可以赶上火车 ONPASTE ValueChangeEvent

    public void onModuleLoad() {
        final Label text = new Label();
        final ExtendedTextBox box = new ExtendedTextBox();
        box.addValueChangeHandler(new ValueChangeHandler<String>() {
    
            @Override
            public void onValueChange(ValueChangeEvent<String> event) {
                text.setText(event.getValue());
            }
    
        });
        box.addKeyUpHandler(new KeyUpHandler() {
    
            @Override
            public void onKeyUp(KeyUpEvent event) {
                text.setText(box.getText());
            }
        });
    
        RootPanel.get().add(box);
        RootPanel.get().add(text);
    }
    
    private class ExtendedTextBox extends TextBox {
    
        public ExtendedTextBox() {
            super();
            sinkEvents(Event.ONPASTE);
        }
    
        @Override
        public void onBrowserEvent(Event event) {
            super.onBrowserEvent(event);
            switch (DOM.eventGetType(event)) {
                case Event.ONPASTE:
                    Scheduler.get().scheduleDeferred(new ScheduledCommand() {
    
                        @Override
                        public void execute() {
                            ValueChangeEvent.fire(ExtendedTextBox.this, getText());
                        }
    
                    });
                    break;
            }
        }
    }
    

        2
  •  3
  •   zolv    9 年前

    作为一个通用的解决方案,什么对我有效(请点击此处发表评论):

    here here

    处理程序类:

    import com.google.gwt.event.shared.EventHandler;
    
    public interface InputHandler extends EventHandler {
    
      void onInput(InputEvent event);
    
    }
    

    事件类别:

    import com.google.gwt.event.dom.client.DomEvent;
    
    public class InputEvent extends DomEvent<InputHandler> {
    
        private static final Type<InputHandler> TYPE = new Type<InputHandler>("input", new InputEvent());
    
        public static Type<InputHandler> getType() {
            return TYPE;
        }
    
        protected InputEvent() {
        }
    
        @Override
        public final Type<InputHandler> getAssociatedType() {
            return TYPE;
        }
    
        @Override
        protected void dispatch(InputHandler handler) {
            handler.onInput(this);
        }
    
    }
    

    用法:

    box.addDomHandler(new InputHandler() {
    
        @Override
        public void onInput(InputEvent event) {
            text.setText(box.getText());
        }
    },InputEvent.getType());
    

    它适用于每个文本框值的更改,包括使用上下文菜单粘贴。它不会对箭头、ctrl、shift等做出反应。。。

        3
  •  1
  •   mosherj8StackOverFlow    15 年前

        4
  •  1
  •   Daniel De León    7 年前

    我更喜欢使用 Elements Widgets

        Element input = Document.get().getElementById("my-input");
        DOM.sinkBitlessEvent(input, "input");
        DOM.setEventListener(input, event -> GWT.log("Event!"));
    
        5
  •  0
  •   Ashwin Prabhu    16 年前

        6
  •  0
  •   Bikas Katwal    10 年前
    Just saw this question. Because I was facing the similar problem. 
    

    做了一些黑客,它为我工作。 您可以使用KeyUpHandler,但将其与检查的附加if块一起使用 文本框的长度。如果文本框的长度为>0,做你该做的。

    textBox.addKeyUpHandler(new KeyUpHandler() {
        @Override
        public void onKeyUp(KeyUpEvent keyUpEvent) {
        if (textBox.getText().length() > 0) {
        //do your stuff`enter code here`
    
        }
        }