web-dev-qa-db-fra.com

Autoriser uniquement les nombres dans la zone de texte dans GWT?

J'ai une exigence où je dois autoriser uniquement les nombres dans la zone de texte. si l'utilisateur tente d'entrer un autre caractère que des chiffres, nous devons annuler l'événement. S'il vous plaît aidez-moi comment y parvenir?

Merci!

gwt
21
user1016403

Il vous suffit de valider la saisie des utilisateurs sur un certain événement. Cela peut être par exemple à chaque frappe de touche (KeyPressEvent), lorsque la zone de texte perd le focus (ValueChangeEvent), lorsque vous appuyez sur un bouton (ClickEvent), etc. Vous implémentez un gestionnaire d'événements, par exemple KeyPressHandler et enregistrez votre implémentation avec la TextBox. Ensuite, dans votre gestionnaire, vous validez la valeur de la zone de texte et si elle contient autre chose que des nombres, vous revenez de la méthode, en indiquant probablement à l'utilisateur que la valeur n'était pas valide.

Quelque chose comme ça:

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
    }
});

Si vous avez beaucoup de validation à faire, vous voudrez probablement introduire un cadre de validation qui vous évitera de réinventer la roue. Il existe peut-être de meilleures alternatives de nos jours, mais personnellement, je suis assez satisfait du cadre de validation GWT-VL .

15
toman

Ce qui suit est une approche plus générique et permet la réutilisation du code. Vous pouvez utiliser le gestionnaire NumbersOnly pour n’importe quelle zone de texte (de la même classe) de votre choix.

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();
        }
    }
12
bmoran
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();
            }
        }
    }
7
knocker

J'ai ajouté d'autres exceptions, par exemple la possibilité de copier le numéro. Il empêche toujours le collage d'éléments dans le presse-papiers.

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();
        }
    }
}
4
Blakhar

Remplacez votre TextBox par un IntegerBox ou LongBox .

Ce n’est pas sémantiquement équivalent à autoriser uniquement des chiffres, mais c’est sans doute mieux dans la plupart des cas d’utilisation.

2
djjeck

Essaye celui-là:

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();
    }
}
2
Shishir Mane

vous pouvez le valider avec la méthode 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;
       }

votre zone de texte sera comme ça

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

J'ai eu le même problème (en utilisant un IntegerBox qui est plus ou moins la même chose) et l'a fait comme ça;

    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
        }
    });
0
Old Nick

La ValueBox n'est pas conçue pour filtrer les entrées. Pourquoi? Parce que l’utilisateur comptera votre application comme entrée dans ANR ou comme corrompue lorsqu’il appuiera sur les touches du clavier du bureau, oui? Ce n’est pas un téléphone avec ses types de jeu de touches séparés, oui? Donc, la seule solution C’est pour signaler aux personnes qu’elles ont saisi des caractères incorrects, par exemple une coloration rouge. Laissez-moi vous soumettre un exemple de code:

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");
    });

et en css:

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