Discussion :

[titof90]

Bonjour,

J'ai récemment créé un formulaire de recherche rapide.
Lorsque l'on clique dans la barre, la valeur par défaut s'efface.
Si on clique, qu'on ne rentre rien et qu'on ressort, le texte par défaut réapparait.

Ce texte par défaut est affiché en italique et en gris à l'aide d'une classe css.

Le problème c'est que quand je rempli mon champ, je reste en gris et en italique alors que je souhaiterais repasser en noir normal.
Un ami m'a parlé de la méthode removeclass présente dans mootools (je l'utilise par ailleurs pour d'autre chose, il est donc inclus dans mon code html)

Voici le lien qui présente la méthode : http://mootools.net/docs/core/Element/Element

Malgré mes efforts je n'ai pas réussi a faire marcher cette méthode.
Je souhaiterais que sur l'évènement onclick le css par defaut soit supprimé au profit d'un autre en plus d'effacer le champ.

Voici mon code javascript clearform.js qui fonctionne :

Code :

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

1
2
3
4
5
6
7
8
9
10
11
function clickclear(thisfield, defaulttext) {
if (thisfield.value == defaulttext) {
thisfield.value = "";
}
}
 
function clickrecall(thisfield, defaulttext) {
if (thisfield.value == "") {
thisfield.value = defaulttext;
}
}

Le code html :

Code :

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

1
2
3
4
5
6
7
		<form action="vars.php" method="post" class="fastsearch">
        	<label for="film">Film</label>
            <input type="text" name="film" id="film" class="fontformvalue" size="18" maxlength="128" value="Ex: the mask" onclick="clickclear(this, 'Ex: the mask')" onblur="clickrecall(this, Ex: the mask')"/>
			<label for="annee">Année</label>
            <input type="text" name="annee" id="annee" class="fontformvalue" size="18" maxlength="128" value="Ex: 1999"  onclick="clickclear(this, 'Ex: 1999')" onblur="clickrecall(this, 'Ex: 1999')"/>
			<input type="submit" name="submit" id="submit" value="GO" />
		</form>

Le code css :

Code :

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

1
2
3
.fastsearch {float: left;}
.fastsearch input#departement , .fastsearch input#service{margin-left:4px; margin-right:4px}
.fontformvalue {color: #999; font-style: italic;}

Il s'agirait donc d'ajouter à la fonction clickclear la suppression de la class fontformvalue.

Merci d'avance pour votre aide

[vermine]

Bonjour,

Je ne connais pas MooTools mais la syntaxe du lien que vous nous avez donné semble "simple". Qu'avez-vous testé ?

Code :

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

1
2
 
thisfield.removeClass("fontformvalue");

[titof90]

Que dire si ce n'est que j'ai honte
J'avais mis cette syntaxe :

$('film').removeClass('fontformvalue');

Pensant que le myelement etait sur le div.
Bref, j'ai fais n'importe quoi

Encore merci pour ton aide Vermine