11521 sujets

JavaScript, DOM et API Web HTML5

[Résolu] Afficher le contenue d'une variable

Bonjour,
Je n'arrive pas à afficher dans un span un texte précis suivant l'id d'un input.
ici id = Fname


var ValFname ="texte";
$('#Preview'+id).text('Val'+id);


J'arrive bien à sélectionner le bon span mais il affiche le nom de la variable pas le contenu.
Je ne vois pas du tout comment faire même si c'est peut être très simple.
Salut,

Est ce que tu peux expliquer plus précisément ce que tu veux faire, et mettre le html et le javascript ? (je ne trouve pas super clair Smiley sweatdrop )
SnaKi a écrit :

J'arrive bien à sélectionner le bon span mais il affiche le nom de la variable pas le contenu.

Salut

En meme temps c'est ce que tu demande avec Val'+id dans le .text().

vu que id = Fname, si tu fais Val'+id tu auras la concaténation de Val et Fname. Donc au final il t'affiche bien le contenue de la variable ID qui est égale au nom de la variable qui contient le texte "Texte" que tu aimerais afficher...

la concaténation dynamique de variable en jquery ne fonctionne pas comme cela; pour ça il faut utiliser les crochets en javascript pour acceder à une variable via une variable dynamique.
Modifié par JENCAL (06 Mar 2020 - 10:05)
Désolé si je n'ai pas été claire.
Voici le code:


<div class="form">
	<input id="Fname" type="text" value="" autocomplete="off" required />
	<input id="Status" type="text" value="" autocomplete="off" required />
	<input id="Department" type="text" value="" autocomplete="off" maxlength="10" required 
	<input id="Year" type="tel" value="" autocomplete="off" maxlength="1" required />
</div>
<div>
	<span id="PreviewFname">PRENOM</span>
	<span id="PreviewStatus">STATUT</span>
	<span id="PreviewDepartment">DEPARTEMENT</span>
	<span id="PreviewYear">ANNEE</span>
</div>




$('.form').find('input').on('keyup', function () {
		var   id = this.id,
			val = $this.val(),
                       ValFname = 'PRENOM',
			ValStatus = 'SATUT',
			ValDepartment = 'DEPARTEMENT',
			ValYear = 'ANNEE';

			if (val ="") {
				$('#Preview'+id).text('Val'+id);
			}
});

J'ai un peu simplifié.
Mais en gros, je voudrais, quand l'input est vide afficher les messages correspondants et les afficher dans les SPAN correspondants.
J'ai trouvé une autre manière de faire mais je voudrais savoir si on pouvait faire ça.

Du coup comment fonctionne "la concaténation dynamique de variable" ou les variables dynamique ?
Smiley hum

En gros tu veux faire un tableau quoi ?

var Ids2Valeurs={"Fname" : 'PRENOM', "Status" : 'SATUT', "Department" : 'DEPARTEMENT', "Year" : 'ANNEE' }

//Quand tu veux obtenir une des valeurs : 
Ids2Valeurs[id];


Et l'exemple qui va avec : https://jsfiddle.net/t36x5dvh/

Et sinon pour faire plus simple tu met juste des attributs placeholder dans tes inputs et ça s’enlève tout seul et ça revient tout seul aussi : 

<input id="Fname" type="text" placeholder="Prenom" value="" autocomplete="off" required />
Meilleure solution
Merci,

C'est exactement ce que je voulais et je ne sais pas pourquoi je n'ai pas pensé à utiliser un tableau...

Sinon pour le placeholder ça ne marchera pas, c'est un label qui fait fonction de placeholder et il se déplace quand l'on commence à rentrer des informations.
Modifié par SnaKi (06 Mar 2020 - 14:11)
Sujet clos
Aller à