Discussion :

[xxkirastarothxx]

Bonjour à tous.

Voila j'ai un petit problème:

dans un de mes scripts jQuery, j'essaye de remplacer le type d'un input lors de son focus; Hors, il n'est pas possible de modifier directement le type de l'input, cela nous retourne une erreur.

Pour pallier à ce problème j'ai fait comme suit:

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

$('#monInput').replaceWith($('#monInput').clone().attr('type', 'password'));

Le problème étant que cette ligne fait perdre le focus à cet élément.

Dans un cas classique, j'aurai simplement fait un

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

$('#monInput').focus()

sauf que dans mon cas, le replaceWith est déjà dans un on("focus", [...]); ce qui provoque une récursion infinie :/

Aurriez vous une idée de comment régler le problème ?


Edit:
une solution temporaire est de remplacer le on("focus" par un on("click", mais cela ne fait pas exactement ce que je voudrais; j'aimerai que, si possible, cette action ne s’exécute qu'au focus, et non a chaque click sur l'input

Merci =D

[SpaceFrog]

A quoi sert le replaceWith ?
pourquoi ne pas juste modifier le type ?.

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

<input type="text" value="mot de passe" id="monInput" />

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
 
$('#monInput').on('focus', function () {
    $(this).attr('type', 'password');
})

je n'ai pas d'erreur avec ce code
http://jsfiddle.net/jRPMh/

Sinon au pire avec one()

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
$('#monInput').one('focus', function () {
    $(this).replaceWith($('#monInput').clone().attr('type', 'password'));
    $('#monInput').focus();
});

[xxkirastarothxx]

Ah tient, en effet, changer directement le type avec jQuery 1.9 est possible.

Malheureusement je dois utiliser jQuery 1.8.3, et ce n'est pas possible avec cette version. Dans ce cas nous avons le message d'erreur suivant:

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

Error: type property can't be changed

Le problème si j'utilise one(), je suppose, est que cette dernière ne fonctionne qu'une seul fois c'est bien ça ?
Du coup si l'utilisateur quite l'input, et reviens dessus plus tard ça ne marchera plus, si je comprends bien. a moins de redéfinir l'écouteur manuellement à la rigueure.

J'ai trouvé une autre solution sinon, c'est simplement de verifier le type de mon champs avant:

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
$("#monInput").on("focus", function(){
    if($(this).attr('type')=="text"){
        $(this).replaceWith($('#monInput').clone().attr('type', 'password'));
        $(this).focus();
    }
    else
    {
        [le reste de ma fonction]
    }
});

Pour le moment c'est la solution qui me parait le plus clean: le premier passage dans la fonction change le type de mon input, génère un nouveau focus pour que la fonction s’exécute une seconde fois, mais cette fois sans passer la partie de changement de type + focus.

J'aurai bien aimer trouver plus propre, mais bon je pense que c'est tout de même une solution viable.
Si quelqu'un à mieux, je suis preneur
sinon je passerai le post en résolu demain

[SpaceFrog]

one me semble plus propre ...

[xxkirastarothxx]

Bah, dans mon cas, l'utilisation de one() me parrait compliqué:

Enfait, il s'agis d'un script d'inscription.

J'ai donc bindé des on("blur") sur le champs de password, pour qu'a la perte du focus de celui ci, un script de verification se lance.
Selon mon cahier des charges, en cas d'erreur je dois faire apparaitre le message d'erreur dans... le champs en question.

Donc, lors de mon on("blur"), je fais mes petites verif, et s'il y a une erreur, je transorme mon input type="password" en input type="text" afin d'y inserer le message d'erreur en value (et donc que celui ci soit lisible).

Par la suite, le but du on("focus") est donc de repasser cet input en type="password" afin que l'utilisateur puisse de nouveau modifier son password éronné. Mais, évidement, à la perte du focus, celui ci doit de nouveau être vérifier et donc peut éventuellement repasser du type="password" à text, et ainsi de suite.


Donc, si j'ai bien compris l'utilisation de one(), lors du premier focus, il n'y aurra pas de problème, mais si après vérification il y a une erreur, et que l'utilisateur prends le focus de ce champs de nouveau, cette fois-ci one() ne fonctionnera pas.


Alors, comme je disais, il y a toujours moyen de binder une one() dans ma fonction de vérification du password, mais ça veut dire re-binder un événement à chaque fois que je vérifie le contenu de mon input :/

Est-ce vraiment mieux de faire comme ça plutot que ce que j'utilise à l'heure actuelle ? (en espérant avoir été clair )

[SpaceFrog]

la question de base à se poser serait plutot quelle est vraiment l'utilité de basculer de texte en password ...