Autoriser surbrillance d'un input mais interdire la modification

Version imprimable

06/12/2012, 11h10
tomi45

Autoriser surbrillance d'un input mais interdire la modification

Bonjour à tous,

tout est dans le titre:

J'ai un champs input qui affiche une valeur, je souhaite que ce champs est la possibilité d'être mis en surbrillance par l'utilisateur mais uniquement en surbrillance car il ne doit pas pouvoir modifier cette valeur.

J'ai donc autorisé la surbrillance avec le readonly mais maintenant je suis bloqué...

Merci par avance de votre aide.

Thomas
06/12/2012, 11h19
SpaceFrog

bloqué ?
quel est donc ce mystérieux blocage ?
06/12/2012, 11h24
Bovino

Pourquoi vouloir utiliser un input si tu ne souhaites pas que ce soit un input ? :koi:

Autant faire ça avec un span ou une autre balise adaptée à ce que tu souhaites afficher, ensuite, un peu de CSS et / ou JavaScript permettent tout type de mise en forme...
06/12/2012, 11h37
tomi45

D'abord merci pour vos réponses.

En effet je n'ai pas été assez clair^^

L'input affiche une valeur qui est formaté(1 33 44).
Le readonly permet, lors du clic, d'enlever ce formatage(13344) et permet donc à l'utilisateur de copier cette valeur.

Or je ne souhaite pas qu'il puisse la modifier mais juste la sélectionner.

Est ce plus clair ?:?
06/12/2012, 11h42
SpaceFrog

Citation:

permet donc à l'utilisateur de copier cette valeur.

ha il ne peut pas la copier dans un span ?

copier = ??? comment ???
06/12/2012, 11h42
DrDarko

Citation:

Envoyé par Bovino

Pourquoi vouloir utiliser un input si tu ne souhaites pas que ce soit un input ? :koi:

Autant faire ça avec un span ou une autre balise adaptée à ce que tu souhaites afficher, ensuite, un peu de CSS et / ou JavaScript permettent tout type de mise en forme...

Dans certain formulaire lorsque l'on remplit des champs ou que l'on coche des checkbox certains champs ne sont plus à informer et donc on les bloque.
Après c'est sur que ce n'est pas forcément la meilleure technique pour présenter un formulaire...

Citation:

je suis bloqué

Ça ne veut rien dire...
Tu veux accéder à ton champs et ça ne marche plus...?
L'envoie de ton formulaire est bloqué...?

Mets un peu de code l'histoire de nous éclairer ça serait plus simple et détailles ton blocage stp.

EDIT : Bon désolé vous avez été trop rapide.
06/12/2012, 11h48
tomi45
"bloqué" entre guillemet, c'est mon cerveau qui bloque:lol:

voici mon code:
Code:

1 2 onClick="document.getElementsByName(champs)[0].readonly=false;" //Permet le deformattage du champs
Mais l'utilisateur peut maintenant modifier la valeur :/ alors qu'il doit uniquement pouvoir faire un simple copié coller de cette valeur qui a été déformattée
06/12/2012, 11h54
Bovino

Allez, c'est mon jour de bonté :

Code:

<input id="foo" readonly="readonly" value="1 33 44" data-formated="1 33 44" data-unformated="13344" onfocus="this.value=this.getAttribute('data-unformated');this.select()" onblur="this.value=this.getAttribute('data-formated');" />

Code:

1
2
3
4
5
6
7
8
9
10
11
12
<style type="text/css">
 #foo {
 border:inset 2px silver;
 width: 80px;
 padding: 0 5px
 }
</style>
</head>
 
<body>
<div id="foo" onmouseover="this.innerHTML='22222'" onmouseout="this.innerHTML='22 22 22'">22 22 22</div> 
</body>

06/12/2012, 11h58
tomi45

Merci :ccool:
je vais voir ça!
06/12/2012, 12h01
Bovino

Spaffy, sauf erreur de ma part, ce que souhaite tomi45, ce serait que le clic remplace le double clic, c'est-à-dire que le texte en question soit sélectionné pour un éventuel copier.
C'est faisable dans une div bien sûr, mais là, j'ai pas le temps (ni l'envie à vrai dire :aie:) de le faire... c'est pourquoi je suis resté sur l'input. ;)
06/12/2012, 12h02
SpaceFrog

Beef onclick ... et si tu arrives sur l'input par tabulation et que tu selectionnes par ctrl a c ?
06/12/2012, 12h24
Watilin
+1 Bovino ! Mais comme le fait remarquer Spaff, c'est plus cohérent d'utiliser onfocus plutôt que onclick.
Citation:
Envoyé par tomi45

"bloqué" entre guillemet, c'est mon cerveau qui bloque:lol:

voici mon code:

Code:

1 2 onClick="document.getElementsByName(champs)[0].readonly=false;" //Permet le deformattage du champs

Mais l'utilisateur peut maintenant modifier la valeur :/ alors qu'il doit uniquement pouvoir faire un simple copié coller de cette valeur qui a été déformattée
Tomi45, si c'est ton script qui modifie la valeur, tu n'as pas besoin de retirer le readOnly.
06/12/2012, 14h00
Bovino

Effectivement... J'ai remplacé onclick par onfocus qui est plus adapté dans mon exemple. ;)