Разрешить только цифры в текстовом поле в GWT?

Question

У меня есть требование, когда мне нужно разрешить только цифры в текстовом поле.если пользователь пытается ввести любой другой символ, кроме цифр, нам нужно отменить событие.Пожалуйста, помогите мне, как этого добиться?

Спасибо!

Answer 1

Вам просто нужно подтвердить ввод пользователя для определенного события.Это может быть, например, при каждом нажатии клавиши (KeyPressEvent), когда TextBox теряет фокус (ValueChangeEvent), нажатие кнопки (ClickEvent) и т. Д.Вы реализуете обработчик событий, например, KeyPressHandler, и регистрируете свою реализацию в TextBox.Затем в вашем обработчике вы проверяете значение TextBox и, если оно содержит нечто иное, чем числа, вы просто возвращаетесь из метода, вероятно, каким-то образом сообщая пользователю, что значение недопустимо.

Примерно так:

final TextBox textBox = new TextBox();
textBox.addKeyPressHandler(new KeyPressHandler() {
    @Override
    public void onKeyPress(KeyPressEvent event) {
        String input = textBox.getText();
        if (!input.matches("[0-9]*")) {
            // show some error
            return;
        }
        // do your thang
    }
});

Если вам нужно выполнить много проверок, вы, вероятно, захотите внедрить некоторую среду валидации, которая избавит вас от необходимости изобретать велосипед заново.В настоящее время могут быть лучшие альтернативы, но лично я был вполне удовлетворен рамочной проверкой GWT-VL .

Answer 2

Ниже приведен более общий подход, позволяющий повторно использовать код. Вы можете использовать обработчик NumbersOnly для любого текстового поля (того же класса), которое вы хотите.

intbox1.addKeyPressHandler(new NumbersOnly());
intbox2.addFocusHandler(new OnFocus());


//inner class
class NumbersOnly implements KeyPressHandler {
        @Override
        public void onKeyPress(KeyPressEvent event) {
            if(!Character.isDigit(event.getCharCode()))
                ((IntegerBox)event.getSource()).cancelKey();
        }
    }

Answer 3

class NumbersOnly implements KeyPressHandler {

        @Override
        public void onKeyPress(KeyPressEvent event) {
            if (!Character.isDigit(event.getCharCode()) 
                    && event.getNativeEvent().getKeyCode() != KeyCodes.KEY_TAB 
                    && event.getNativeEvent().getKeyCode() != KeyCodes.KEY_BACKSPACE){
                ((IntegerBox) event.getSource()).cancelKey();
            }
        }
    }

Answer 4

Я добавил другие исключения, например, возможность скопировать номер. Это все еще предотвращает вставку вещей из буфера обмена.

public class NumbersOnlyKeyPressHandler implements KeyPressHandler {
    @Override
    public void onKeyPress(KeyPressEvent event) {

        switch(event.getNativeEvent().getKeyCode()) {
        case KeyCodes.KEY_TAB: 
        case KeyCodes.KEY_BACKSPACE: 
        case KeyCodes.KEY_DELETE: 
        case KeyCodes.KEY_LEFT: 
        case KeyCodes.KEY_RIGHT: 
        case KeyCodes.KEY_UP: 
        case KeyCodes.KEY_DOWN: 
        case KeyCodes.KEY_END: 
        case KeyCodes.KEY_ENTER:
        case KeyCodes.KEY_ESCAPE:
        case KeyCodes.KEY_PAGEDOWN:
        case KeyCodes.KEY_PAGEUP:
        case KeyCodes.KEY_HOME:
        case KeyCodes.KEY_SHIFT:
        case KeyCodes.KEY_ALT:
        case KeyCodes.KEY_CTRL:break;
        default:

            if(event.isAltKeyDown() || (event.isControlKeyDown() && (event.getCharCode() != 'v'&& event.getCharCode() != 'V'))  )
                break;

            if(!Character.isDigit(event.getCharCode()))
                    if(event.getSource() instanceof IntegerBox)
                        ((IntegerBox)event.getSource()).cancelKey();
        }
    }
}

Answer 5

Замените ваш TextBox на IntegerBox или LongBox .

Это семантически не то же самое, что разрешать только цифры, но, возможно, лучше в большинстве случаев использования. Вы также получите бесплатный разбор целых чисел.

Answer 6

Попробуйте это:

public void onKeyPress(KeyPressEvent event) {
    if(event.getNativeEvent().getKeyCode()!=KeyCodes.KEY_DELETE && 
        event.getNativeEvent().getKeyCode()!=KeyCodes.KEY_BACKSPACE &&
        event.getNativeEvent().getKeyCode()!=KeyCodes.KEY_LEFT &&
        event.getNativeEvent().getKeyCode()!=KeyCodes.KEY_RIGHT){
            String c = event.getCharCode()+"";
            if(RegExp.compile("[^0-9]").test(c))
                textbox.cancelKey();
    }
}

Answer 7

Вы можете проверить его с помощью метода javascript:

function isNumberKey(evt)
       {
          var charCode = (evt.which) ? evt.which : event.keyCode;
          if (charCode != 46 && charCode > 31 
            && (charCode < 48 || charCode > 57))
             return false;

          return true;
       }

Ваше текстовое поле будет выглядеть следующим образом

<input class="txtStyle" type="text" autocomplete="off" onkeypress ="return isNumberKey(event);" />

Answer 8

У меня была та же проблема (при использовании IntegerBox, которая более или менее одинакова), и я сделал это так;

    fieldName.addKeyPressHandler(new KeyPressHandler() {            
        @Override
        public void onKeyPress(KeyPressEvent event) {
            // Prevent anyone entering anything other than digits here
            if (!Character.isDigit(event.getCharCode())) {
                ((IntegerBox) event.getSource()).cancelKey();
                return;
            }
            // Digits are allowed through
        }
    });

Answer 9

ValueBox не предназначен для фильтрации входных данных.Зачем?Потому что пользователь будет считать ваше приложение входящим в ANR или поврежденным при нажатии клавиш клавиатуры рабочего стола, да?Это не телефон с отдельными типами клавиатур, да?Таким образом, единственное решение здесь состоит в том, чтобы сигнализировать людям, что они вводят неправильные символы, например, красным цветом.Позвольте мне представить пример кода:

IntegerBox field = new IntegerBox();
        field.setStyleName("number_ok");
    field.addKeyUpHandler(event -> {
        String string = field.getText();
        char[] harfho = string.toCharArray();
        for (char h : harfho) {
            try {
                Integer.parseInt(""+h);
            } catch (NumberFormatException e) {
                field.setStyleName("number_error");
                return;
            }
        }
        field.setStyleName("number_ok");
    });

и в css:

.number_error{
  background-color: red;
}
.number_ok{
  background-color: transparent;
}