Discussion :

[leminipouce]

Bonjour tout le monde.

J'ai un champ input type=password que je voudrais protéger en écriture dès qu'une checkbox est cochée.
Mon souhait serait de la mettre en readonly, mais avec un rendu graphique identique au disabled. (car le disabled m'empêche de récupérer sa valeur).

Problème je n'arrive pas à activer/désactiver le readonly avec un JavaScript.
Problème 2, je narrive pas à changer la couleur de mes "boulettes" dans le champ.

Voici mon code JS :

Code :

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

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
39
40
41
42
43
44
45
function disableInput(obj){
    if(document.forms[0].useNameAsPassword.checked){
        document.forms[0].<%=MessageContent.PASSWORD%>.readonly='true';
    }else{
        document.forms[0].<%=MessageContent.PASSWORD%>.readonly='false';
    }
}
 
function inputDisabled(obj){
   if(document.forms[0].useNameAsPassword.checked){
        document.forms[0].<%=MessageContent.PASSWORD%>.blur();
        //document.forms[0].<%=MessageContent.PASSWORD%>.style.display="none";
        //document.forms[0].<%=MessageContent.PASSWORD%>.style="background-color:'#33FF00'"
   }else{
       //document.forms[0].<%=MessageContent.PASSWORD%>.style="background-color:'#FFFF00'"
   }
}
 
function inputEnable(id, state, obj) {
    var divObj = null;
 
    if (document.getElementById) {
    divObj = document.getElementById(id);
    } else if(document.all) {
    divObj = document.all(id);
    } else if (document.layers) {
    divObj = document.layers[id];
    }
 
    //Here, divObj == document.forms[0].<%=MessageContent.PASSWORD%>
 /*   
    if(state && divObj){
        alert("add att");
    divObj.setAttribute("readonly","readonly");
    }else if(divObj){
        alert("remove att");
    divObj.removeAttribute("readonly");
    divObj.focus();
    }
 */
 
    document.forms[0].<%=MessageContent.PASSWORD%>.focus();
 
    _update(obj);
}

Et voici mes champ PASSWORD et CHECKBOX :

Code :

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

1
2
3
4
5
6
7
<TD>
                        <input type="password" name="<%=MessageContent.PASSWORD%>" id="<%=MessageContent.PASSWORD%>" style="width:200" value="<%=projects.get(0)%>"  onfocus="inputDisabled(this);">
                    </TD>
                    <TD></TD>
                    <TD>
                        <input type="checkbox" name="useNameAsPassword" checked onclick="inputEnable('<%=MessageContent.PASSWORD%>', this.checked, this);">Use project name for password
                    </TD>

Si quelqu'un voit d'où vient mon problème ou détiens une solution, je suis preneur.

PS: Je pensais ce sujet en rapport avec HTML et je l'ai déjà posté sur ce forum ici. Désolé pour ça.

[leminipouce]

Je crois qu'il y a un proverbe qui dit "On est jamais mieux servi que par moi même" -Non en réalité, tous les honneurs reviennent à SpaceFrog, qui a fait remarqué dans un autre post une bête erreur... de casse !!!!

Voici donc le résultat chez moi avec la fonction JavaScript :

Code :

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

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
function enableInput(id, state, obj){
    var divObj = null;
 
    if (document.getElementById) {
    divObj = document.getElementById(id);
    } else if(document.all) {
    divObj = document.all(id);
    } else if (document.layers) {
    divObj = document.layers[id];
    }
 
    //Here, divObj == document.forms[0].<%=MessageContent.PASSWORD%>
    if(state && divObj){
    divObj.setAttribute("readOnly","readOnly");
    divObj.style.background = '#DBDBDB';
    }else if(divObj){
    divObj.removeAttribute("readOnly");
    divObj.style.background = '#FFFFFF';
    divObj.focus();
    }
 
 
    document.forms[0].<%=MessageContent.PASSWORD%>.focus();
 
    _update(obj);
}

les plus doués remarqueront une majuscule sur le O de readOnly.

et la déclaration du formulaire suivante :

Code :

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

1
2
3
4
5
6
7
<TD>
                        <input type="password" name="<%=MessageContent.PASSWORD%>" id="<%=MessageContent.PASSWORD%>" style="width:200" style="background-color:#DBDBDB" value="<%=projects.get(0)%>"  readOnly="readOnly">
                    </TD>
                    <TD></TD>
                    <TD>
                        <input type="checkbox" name="useNameAsPassword" checked onclick="enableInput('<%=MessageContent.PASSWORD%>', this.checked, this);">Use project name for password
                    </TD>

Voilà, ainsi, c'est pas mal, mais j'aurais préféré changer la couleur des bullets du password et non le fond. Or si j'essaie de changer le foreground au lieu du background... rien ne se passe. Une idée ?

[leminipouce]

Ok les gens.

Je pense que je ne vais pas passer plus de temps sur ce problème. On va dire que ça va bien comme ça et que c'est suffisament explicite et clair.

J'ai coloré le fond en gris et je ne suis pas sûr que ce soit vraiment trivial de coloré les "bullets".

Merci quand même. @+