JS + Expression rationnelle : afficher ce qui NE match PAS

Version imprimable

Bonjour,
J'appelle souvent ce genre de code pour afficher (dans un formulaire par exemple) si le contenu saisi est valide (true) ou pas (false) sur un .change (JQuery).
Code:

1 2 3 4 5 6 7 8 9 10 function libelleValide(str){ var res=""; if (str) { var re = new RegExp('^\\w+([-\' ]\\w+)*$'); str=str.toLowerCase(); str=supprimeAccents(str); res=re.exec(str); } return (res); }
Aujourd'hui je me pose une question : si je voulais aller plus loin (afficher ce qui ne match pas en cas d'erreur), comment pourrais-je m'y prendre ?
Exemple : si str est "ce texte n+est pas valide" retourner par exemple "+" ou "ce texte n#+#est pas valide" ou n'importe quoi que je puisse traiter pour affichage plus explicite que "c'est pas correct/conforme"

Une idée (qui ne soit pas une usine à gaz) ?

13/05/2016, 13h21
SpaceFrog

Faire un replace de ce qui ne matche pas en y ajoutant une balise strong autour avec un style color red ...
13/05/2016, 16h02
Invité

Merci pour votre réponse.
Je m'aperçois que je me suis mal exprimé...
Ma question était plutôt : comment détecté ce qui ne match pas.

Bonjour,
change d'approche, testes si les caractères non souhaités sont dans ta chaine.

Code:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
function getNok(str) {
    var tmp;
    var nok = '+-/:'.split('');
    var i, nb = nok.length;
    for (i = 0; i < nb; i += 1) {
        tmp = str.split(nok[i]);
        str = tmp.join('#' + nok[i] + '#'); // pour peu que les # n'appartiennent pas aux nok !
    }
    return str;
}
var strOK  = 'ce texte est pas valide';
var strNOK = 'ce texte + n\'est pas va +lide';
 
console.log(getNok(strOK) !== strOK);   // false
console.log(getNok(strNOK));            // ce texte #+# n'est pas va #+#lide
console.log(getNok(strNOK) !== strNOK); // true

22/05/2016, 16h14
sekaijin

comme il est toujours bon de tester ces expressions

https://regex101.com/

A+JYT
24/05/2016, 09h54
Invité

Merci pour vos réponses.

Citation:

Envoyé par NoSmoking

Bonjour,
change d'approche, testes si les caractères non souhaités sont dans ta chaine.

Je comprends votre approche, mais ça nécessiterait que je connaisse tout ce qu'un internaute est susceptible de vouloir saisir :) ça n'est pas réaliste pour mon cas.

Citation:

Envoyé par sekaijin

comme il est toujours bon de tester ces expressions
https://regex101.com/
A+JYT

C'est amusant ce site (il me semble m'être déjà amusé avec... à moins que ce soit un autre similaire...), je voudrais faire exactement le contraire justement : coloré ce qui ne match pas ;)

Citation:

mais ça nécessiterait que je connaisse tout ce qu'un internaute est susceptible de vouloir saisir...

Certes mais tu sais au moins ce que tu autorises, donc le reste est autorisé et faire un [^a-z] ou plus large !

Sur base de ton code initial tu pourrais faire un truc dans le genre

Code:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
function libelleValide(str) {
    var res = '';
    var re = new RegExp('^\\w+([-\']\\w+)*$');
    var i, nb;
 
    str = str.toLowerCase();
    str = supprimeAccents(str);
 
    if (str) {
        res = re.exec(str);
 
        // si Nok détecté
        if (!res) {
            str = str.split('');
            // parcours des caratères de la chaine
            for (i = 0, nb = str.length; i < nb; i += 1) {
                if (str[i] !== ' ') {
                    // test caractère
                    res = re.exec(str[i]);
                    // si Nok détecté
                    if (!res) {
                        str[i] = '<b>' + str[i] + '</b>'; // mise en gras
                    }
                }
            }
            // reconstruit la chaine
            str = str.join('');
        }
    }
    // retourne la chaine
    return (str);
}
var strOK  = 'ce texte est valide';
var strNOK = 'ce texte + n\'est pas va +lide';
 
console.log(libelleValide(strOK) !== strOK);     // false
console.log(libelleValide(strNOK));              // ce texte <b>+</b> n<b>'</b>est pas va <b>+</b>lide
console.log(libelleValide(strNOK) !== strNOK);   // true