Cacher le texte saisi dans un prompt

abirgl Messages postés 147 Statut Membre -
nagaD.scar Messages postés 4500 Statut Membre - 6 févr. 2017 à 16:11

Bonjour,
Pour valider l'accès d'un client à son espace , je lui affiche un prompt pour qu'il saisisse son mot de passe, mais le texte qu'il saisit est affiché, je veux cacher ce texte en des étoiles, comme si il saisit son texte dans un password field,
Pouvez vous m'aider SVP ??

Afficher la suite

A voir également:

Cacher le texte saisi dans un prompt
Texte de chanson gratuit pdf - Télécharger - Vie quotidienne
Transcription audio en texte word gratuit - Guide
Excel cellule couleur si condition texte - Guide
Cacher son numéro - Guide
Mettre un texte en majuscule - Guide

1 réponse

Réponse 1 / 1

nagaD.scar Messages postés 4500 Statut Membre 252

J avais mal lu (j avais vu le prompt).

Bref, en clair non tu ne peux pas masque le prompt, par contre tu peux faire quelque chose comme :

<?php
if (!isset($_SERVER['PHP_AUTH_USER'])) {
    header('WWW-Authenticate: Basic realm="My Realm"');
    header('HTTP/1.0 401 Unauthorized');
    echo 'Text to send if user hits Cancel button';
    exit;
} else {
    echo "<p>Hello {$_SERVER['PHP_AUTH_USER']}.</p>";
    echo "<p>You entered {$_SERVER['PHP_AUTH_PW']} as your password.</p>";
}
?>

naga

abirgl Messages postés 147 Statut Membre

Merci Naga mais ça ne convient pas à mon besoin :( je voulais bien quelque chose comme ça mais en javascript , avez vous une autre idée ?

nagaD.scar Messages postés 4500 Statut Membre 252

Le soucis étant que le prompt est géré par le navigateur et donc non mangeable via le code (j avais eu aussi ce besoin).

J'avais bien trouvé une solution mais extrêmement lourde : créer une div "par dessus" ton corp avec une zone input type password.

Je n arrive pas à retrouver le code (je suis justement sur un projet ou j en aurai besoin) mais si je mets la main dessus je redis.

naga

nagaD.scar Messages postés 4500 Statut Membre 252

en fait j avais posté la source x)
Mais attention, ce n'est que le code du prompt, mais concernant la mise en page c'est très très moche, bref à adapter a ton besoin quoi:

https://codes-sources.commentcamarche.net/source/101575-js-popup-de-saisie

naga

nagaD.scar Messages postés 4500 Statut Membre 252 > nagaD.scar Messages postés 4500 Statut Membre

je te l ai adapté pour le pass:

<html>
	<head>
		<script>

		function JSform (ObjectName , divTitle , mainDiv ){

			this.targetValidation = "";

			this.myID = "JSfrom";
			this.myName = ObjectName;
			this.cursorElem=0;
			this.elemTitle = divTitle;
			this.elements= new Array();
			this.motherDIVid = mainDiv;
			this.results = null;
			/**********************************************************/
			this.addInput = function  (sLib , sID){
				this.elements[this.cursorElem]=new Array();
				this.elements[this.cursorElem][0]=sID;
				this.elements[this.cursorElem][1] = (sLib == "" ? "" : sLib)+"<input type='text' onkeydown='"+(this.myName == "" ? "" : this.myName+".keyPressedHere()")+"' id='"+sID+"' />";
				this.cursorElem++;
			}
			/**********************************************************/
			this.addInputPass = function  (sLib , sID){
				this.elements[this.cursorElem]=new Array();
				this.elements[this.cursorElem][0]=sID;
				this.elements[this.cursorElem][1] = (sLib == "" ? "" : sLib)+"<input type='password' onkeydown='"+(this.myName == "" ? "" : this.myName+".keyPressedHere()")+"' id='"+sID+"' />";
				this.cursorElem++;
			}
			/**********************************************************/
			this.addOpt = function (tOpt,sID){
				for(i = 0 ; i < tOpt.length ; i++ ){
					this.elements[this.cursorElem]=new Array();
					this.elements[this.cursorElem][0]=sID + "_" + i;
					if(tOpt[i].length > 1 ){
						this.elements[this.cursorElem][1] = "<label><input type='checkbox' id='"+sID+ "_" + i+"' value='"+tOpt[i][0]+"'  onkeydown='"+(this.myName == "" ? "" : this.myName+".keyPressedHere()")+"'>"+tOpt[i][1]+"</label>";
					} else {
						this.elements[this.cursorElem][1] = "<label><input type='checkbox' id='"+sID+ "_" + i+"' value='"+tOpt[i]+"' onkeydown='"+(this.myName == "" ? "" : this.myName+".keyPressedHere()")+"'>"+tOpt[i]+"</label>";
					}
					this.cursorElem++;		
				}	
			}
			/**********************************************************/
			this.start = function () {
				 var elCont = document.getElementById(this.myID);
				  if( elCont != null){
					elCont.parentNode.removeChild(elCont);
				  }
				elCont = document.createElement("div");
				elCont.id = this.myID;

				document.getElementById(this.motherDIVid).style.opacity=0.4;
				elCont.style.display = "block"; // ... on l'affiche...
				elCont.style.position="absolute";
				elCont.style.top="40%";
				elCont.style.right="40%";
				elCont.style.border="solid";
				elCont.style.zIndex ="99";

				var HTMLvalue = "";
				if(this.elemTitle != ""){
					HTMLvalue = "<h1>" + this.elemTitle + "</h1>";
				}
				for(i = 0 ; i < this.cursorElem ; i ++){
					HTMLvalue += this.elements[i][1];
				}
				elCont.innerHTML =HTMLvalue;
				document.body.insertBefore(elCont, document.body.childNodes[0]); 
				document.getElementById(this.elements[0][0]).focus();
			}
			/**********************************************************/
			this.doValidation = function() {
				this.results = new Array();
				for(i = 0 ; i < this.cursorElem ; i ++){
					this.results[this.elements[i][0]] = document.getElementById(this.elements[i][0]).value;
				}
				document.getElementById(this.motherDIVid).style.opacity=1;

				var elCont = document.getElementById(this.myID);
				elCont.parentNode.removeChild(elCont);				
				if(this.targetValidation != ""){
					this.targetValidation(this.results);
				}
			}
			/**********************************************************/
			this.keyPressedHere = function (e) {
				if(window.event.keyCode == 13) {
					for(i = 0 ; i < this.cursorElem ; i ++){
						if( document.activeElement.id == this.elements[i][0]){
							if( i == (this.cursorElem-1)){
								this.doValidation( );
							}
							else {
								document.getElementById(this.elements[i+1][0]).focus();
								break;
							}					
						}
					}
				}	
			}

		}	
</script>

	</head>

	<body>



	<DIV ID="MAIN" style="position:relative;z-index:5;Width:80%;height:80%;background: none repeat scroll 0% 0% #000;">	
	</DIV>


		<script>	
		var ot  = new JSform("ot","titre","MAIN");
		ot.addInputPass("Password:","myPass");
		ot.start();
		ot.targetValidation = function (ar) {
			alert(ar['myPass']);		
		}
</script>


	</body>

</html>

Discussions similaires

Changer la couleur de fond d'un en-tête

question pix mot caché

copie de texte

Afficher écriture cache sur l'image

Votre réponse

Discussions similaires