fonction onchange() qui s exécute pas

**steph49** · 07/08/2023, 01h00

bonjour

je galère avec un onchange().
j ai un formulaire qui demande combien de poste l utilisateur veux créer via une zone de texte.
je voudrai que lorsque la personne rentre un nombre dans cette zone cela me génère sur la même page le nombre rentrer de zone de text de façon a ce que l utilisateur puisse rentrer le nom des postes et que je puisse les insérer dans la table après.
j ai essayer avec un fonction que j appel zone_txt en javascript dans mon head avec le code suivant

Code html :

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

1
2
3
4
5
6
7
8
9
10
11
<script language="javascript">
function zone_txt()
{
var Nbr_Txt=parseInt(document.inscription.Txt.value);
for ( i=0 ; i<Nbr_Txt;i++ )
  {
  document.write("<tr><td><input type="text" name="txt['id']"  size="10" maxlength="255"></td></tr>" );
  }
 
}
</script>

et dans mon formulaire le code suivant

Code html :

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

1
2
3
4
5
6
7
8
<form name="inscription" method="post" action="Insc_valide.php" enctype="multipart/form-data">
 
<tr>
<td><div align="left">
<input type="text" name="txt" id="txt" size="10" maxlength="255" onchange="zone_txt()"></td>
<tr>
<td><div id="zone_txt"></div></td>
</tr>

quand je rentre un chiffre dans ma zone de texte txt et que je clic autre part rien ne ce passe, j'avoue que je suis perdu dans le js.
quelqu'un a une idée

**domi65** · 07/08/2023, 17h09

Document.write n'est pas fait pour ça.
Il faut ajouter dans le DOM les éléments en question
Accessoirement, les tables ne sont pas faites pour de la mise en page, surtout pas à l'heure du "responsive"
Voici un exemple de ce qu'on peut faire (au plus simple, car l'utilisateur doit pouvoir ajouter/supprimer plus tard des zones) J'ai compris que ce sont des inputs de type texte que tu veux ajouter.

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
<body>
<h2>Vos zones de textes</h2>
<p>Combien de zones voulez-vous créer ? <input id=nb_zones  size=3></p>
<form name=formu method=post>
    <div id=zones></div>
    <input type=submit name=submit value="Enregistrer" style="display: none">
</form>
<script>
let zones = document.getElementById('zones');
let nbzones = document.getElementById('nb_zones');
let codehtml = '<p>Entrez le texte dans la zone : <input type=text name="txt[]"></p>'
nbzones.onchange = function() {
    formu.submit.style.display='inline';
    for(i = 0; i < this.value; i++) {
        zones.insertAdjacentHTML('beforeEnd',codehtml);
    }
}
</script>
</body>

**steph49** · 11/08/2023, 02h16

bonjour
j ai tester ton code domi65 et le résultat est parfait mais du coup
comment peut ton récupérer la valeur de i dans ce cas pour l assigner au nom de la zone de text?

Code html :

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

<input type=text name="txt[]"></p>

de façon a ce que ça donne

Code html :

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

1
2
<input type=text name="txt1"></p>
<input type=text name="txt2"></p>

etc etc

afin d enregistrer les information dans la base

**ProgElecT** · 11/08/2023, 09h19

Salut

Code :

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
let zones = document.getElementById('zones');
let nbzones = document.getElementById('nb_zones');
//let codehtml = '<p>Entrez le texte dans la zone : <input type=text name="txt[]"></p>'
let codehtml;
let debcodehtml = '<p>Entrez le texte dans la zone : <input type=text name="txt';
let fincodehtml = '"></p>';
 
 
nbzones.onchange = function() {
    formu.submit.style.display='inline';
    for(i = 0; i < this.value; i++) {
 
        //soit
        //codehtml = debcodehtml + i + fincodehtml;
        //zones.insertAdjacentHTML('beforeEnd',codehtml);
 
        //ou directement
        zones.insertAdjacentHTML('beforeEnd','<p>Entrez le texte dans la zone : <input type=text name="txt'+i+'"></p>';
 
    }
}

**steph49** · 11/08/2023, 15h46

Envoyé par ProgElecT;Domi65;

MERCI a vous deux

je vai pouvoir avancer dans mon bordel

je cloture

**NoSmoking** · 11/08/2023, 17h01

Bonjour,

Envoyé par steph49

comment peut ton récupérer la valeur de i dans ce cas pour l assigner au nom de la zone de text?

ce n'est assurément pas la meilleur façon de faire, côté serveur la forme name="text[]" peut aisément se parcourir dans une simple boucle

Code php :

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

1
2
3
4
// utilisation dans une boucle
foreach($_POST["text"] as $value ) {
  echo $value;
}

**steph49** · 13/08/2023, 16h19

Envoyé par ProgElecT

Salut

Code :

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

let zones = document.getElementById('zones'); ....

petite question une fois cliquer sur le bouton enregistrer qui va m envoyer sur mon autre page afin de valider l inscription et inscrire les infos dans la base la récupération des zones de text "txt" ce fera comment?
car ces zone ce crée en fonction du choix de la personne.

**ProgElecT** · 13/08/2023, 16h40

Salut

NoSmoking t'a donner une indication, il te faut construire un code en PHP pour récupérer et traiter la suite du programme ou éventuellement passer par une fonction AJAX.

**steph49** · 13/08/2023, 16h41

ok je vai chercher tester plusieurs chose le souci c est que lorsque je valide j ai rien qui suis dans la variable js name="txt'.
je cherche et au cas ou je reviendra vers vous

**steph49** · 15/08/2023, 01h12

bon je pense que je va essayer autrement car la je sèche total ca fait 2j que je test différentes chose sans résultat
j ai essayer avec des isset, des empty le foreach ne fonctionne pas ou du moins je vois pas comment le faire fonctionner, j ai meme essayer de récupérer les valeurs via la barre d adresse en _GET etc etc.
sur certaine chose j arrive a voir mes valeurs des input text mais j arrive pas a traiter les informations de façon a les mettre dans ma base.
merci quand même. a vous tous.
je continue mes recherches toute en essayant un autre méthode pour mes zone de text.

**domi65** · 16/08/2023, 11h26

Tu as essayé des tas de trucs mais sans jamais copier ton code ici. On ne peut donc pas dire ce qui ne va pas.

Coder, c'est pas jouer aux devinettes.

fonction onchange() qui s exécute pas

JavaScript

Discussions similaires

Partager

Partager