Remplir un champ de formulaire avec du js

**pracede2005** · 16/11/2009, 15h13

Bonjour,

Je récupère une valeur dans une variable javascript et je souhaite renseigner un champ de mon formulaire. Je ne sais pas coment faire ?

Merci de m'aider

**vermine** · 16/11/2009, 15h16

Bonjour,

Vous avez ceci:

Code :

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

1
2
 
document.getElementById("ID_champ").value = maVariableJS;

Vous cherchez donc à récupérer le champ de votre formulaire qui a pour ID "ID_champ" et lui attribuez comme value celle contenue par maVariableJS.

**pracede2005** · 16/11/2009, 15h23

Merci bien. ça marche.

**Pirotes31** · 08/07/2010, 17h22

Bonjour,

j'ai le même soucis et je n'arrive pas à utiliser votre solution.
Voici la structure de ma page html :

<html>
<head>
<title>Titre Pg HTML</title>
<SCRIPT LANGUAGE="JavaScript">
function RecupData()
{
madata = blabla;
}

</script>
</head>
<body >
<form name="frm" method="post" action="mapage.php">
<input type="text" name="data" value="" />
<input type="submit" name="Submit" onclick="" />
</form>
</body>
</html>

selon votre solution il faut rajouter :
document.getElementById("data").value = madata;
Oui, mais où?
Car si je mets cette ligne entre les balises <script> j'ai un message d'erreur :
document.getElementById(...)' is null or not an object
...
Pouvez-vous m'aider?
D'avance Merci.
Pirotes31.

**vermine** · 09/07/2010, 07h50

Bonjour,

Oui c'est bien dans les balises <script>. Par contre il faut faire attention à l'ordre et à la portée des choses.

Petits exemples:

1) Attribuer une variable inconnue à un champ inconnu

Code html :

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
 
<html>
<head>
<title>Titre Pg HTML</title>
<SCRIPT LANGUAGE="JavaScript">
//1) J'attribue la variable madata au champ data
document.getElementById("data").value = madata;
 
//2) je crée madata en tant que variable locale et je lui donne une valeur
function RecupData()
{
   madata = "blabla";
}
</script> 
</head>
<body >
<!-- 3) Je crée le champ data -->
<form name="frm" method="post" action="mapage.php">
<input type="text" name="data" value="" /> 
<input type="submit" name="Submit" onclick="" /> 
</form>
</body>
</html>

Ici vous voyez bien que vous n'avez pas encore créée la variable et le champ alors que vous essayez déjà d'en changer la valeur, en plus la variable est locale et vous l'utilisez de manière globale.

Incorrect

2) Attribuer une variable locale de manière globale

Code html :

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
 
<html>
<head>
<title>Titre Pg HTML</title>
</head>
<body >
<!-- 1) Je crée le champ data -->
<form name="frm" method="post" action="mapage.php">
<input type="text" name="data" value="" /> 
<input type="submit" name="Submit" onclick="" /> 
</form>
</body>
</html>
 
<SCRIPT LANGUAGE="JavaScript">
//2) J'appelle la fonction qui crée et remplit ma variable
RecupData();
 
function RecupData()
{
   madata = "blabla";
}
 
//3) J'attribue la variable locale madata au champ data alors que je suis en global
document.getElementById("data").value = madata;
</script>

Les variables ont une portées bien définies et madata est locale à la fonction RecupData. Donc vous ne pouvez pas l'utiliser de manière globale.

Incorrect
Soit vous la déclarez de manière globale, soit vous l'utilisez globalement.

3) Exemple qui devrait marcher

Code html :

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
 
<html>
<head>
<title>Titre Pg HTML</title>
 
<!-- 0) Syntaxe prescrite -->
<script type="text/javascript">
//3) J'attribue une valeur à ma variable qui est locale
function RecupData()
{
     var madata = "blabla";
     //4) Vu que ma variable est locale, je l'utilise ici-même
     document.getElementById("data").value = madata;
}
</script> 
</head>
<!-- 2) Lorsque la page sera chargée, j'appelle la fonction qui va remplir mon champ -->
<body onload="RecupData();">
<!-- 1) Je crée le champ data -->
<form name="frm" method="post" action="mapage.php">
<input type="text" name="data" value="" /> 
<input type="submit" name="Submit" onclick="" /> 
</form>
</body>
</html>

Ce n'est pas l'unique solution bien entendu car tout dépend ce que vous voulez faire mais...

Ca marche!

**AMP29** · 21/01/2015, 21h35

Bonjour,
Pour moi l'exemple "correct" ne fonctionne que si je mets :

Code :

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

window.document.getElementById("data").value = madata;

Merci pour ces posts qui m'ont bien aidé.

Remplir un champ de formulaire avec du js

JavaScript

Discussions similaires

Partager

Partager