Javascript formulaire probleme

jm -
avion-f16 Messages postés 20367 Statut Contributeur - 9 févr. 2010 à 16:58

Bonjour,

Je voudrais savoir comment faire pour envoyer les données entrés a l'aide d'un script javascript qui permet a la suite d'un clique sur un lien d'afficher un nouveau champ pour entré des nouvelle données, c'est ces données que je veux envoyer dans la base de donnée, comment faire ??
Voici le code :

<html>

<form action="test.html" method="post">
<fieldset id="zone_text">
<p class="lien"<a href="#" onClick="javascript:add()">Ajouter un champ texte<a></p><br />
</fieldset>

</form>
</p>
<script type="text/javascript">
add();
</script>

<script type="text/javascript">

function refresh(event){
//On sélectionne le premier et le deuxième fieldset
var liste = document.getElementById("liste_deroulante");
var text_fieldset = document.getElementById("zone_text");

//On récupère la position de notre champ texte
var node_source = (document.all)?event.srcElement:event.target;
var position = node_source.previousSibling.nodeValue.split(" ")[1];

//On récupère la valeur dans la champ texte
var labels = text_fieldset.getElementsByTagName("label");
var label = labels[position-1];
var input = label.getElementsByTagName("input")[0];

}

function del(event){
//on sélectionne le premier fieldset et on récupère tous les label qu'il y a à l'intérieur
var text_fieldset = document.getElementById("zone_text");
var labels = text_fieldset.getElementsByTagName("label");

//On récupère le noeud qui émet l'évènement et sa position grâce au texte Valeur x
var node_source = (document.all)?event.srcElement:event.target;
var position = node_source.previousSibling.firstChild.nodeValue.split(" ")[1];

//On décale d'un cran inférieur tous les éléments situés après l'élément à supprimer
for(var i=position;i<labels.length;i++){
var label = labels[i];
var input = label.getElementsByTagName("input")[0];

input.setAttribute("name","nom"+i);

label.firstChild.nodeValue = "Valeur "+i+" ";
}

//Suppression de la zone de texte, du lien et du saut de ligne
var label = labels[position-1];
var lien = label.nextSibling;
var br = lien.nextSibling;
text_fieldset.removeChild(label);
text_fieldset.removeChild(lien);
text_fieldset.removeChild(br);

}

function add(){
//On compte le nombre de label et on sélectionne le premier fieldset
var count = document.getElementsByTagName("label").length;
var text_fieldset = document.getElementById("zone_text");
count ++;

//création du label( <label>Valeur x <input type="text" name="nomx" value="" /></label>)
var input = document.createElement("input");
input.setAttribute("type","text");
input.setAttribute("name","nom"+count);
input.setAttribute("value","");

if(document.all) input.attachEvent("onkeyup",refresh);
else input.addEventListener("keyup",refresh,true);

var nom_label = document.createTextNode("Valeur "+count+" ");
var label = document.createElement("label");
label.appendChild(nom_label);
label.appendChild(input);

//Création des élement br et p ( <p class="lien">Supprimer</p><br /> )
var br = document.createElement("br");
var del_text = document.createTextNode("Supprimer");
var lien_del = document.createElement("p");
lien_del.setAttribute("class","lien");
lien_del.setAttribute("className","lien");

if(document.all) lien_del.attachEvent("onmouseup",del);
else lien_del.addEventListener("mouseup",del,true);

lien_del.appendChild(del_text);

//On raccroche ici tous nos éléments virtuels à une balise de notre fichier XHTML. Ils sont alors affichés
text_fieldset.appendChild(label);
text_fieldset.appendChild(lien_del);
text_fieldset.appendChild(br);

}

</script>
<html>

Afficher la suite

A voir également:

Javascript formulaire probleme
Whatsapp formulaire opposition - Guide
Formulaire de réclamation facebook compte désactivé - Guide
Formulaire de reclamation instagram - Guide
Telecharger javascript - Télécharger - Langages
Confirmer le nouvel envoi du formulaire err_cache_miss - Forum Google Chrome

22 réponses

Réponse 1 / 22

avion-f16 Messages postés 20367 Statut Contributeur 4 509

Dans le name mets cequetuveux[]
Puis il te suffira d'explorer l'array $_POST['cequetuveux'] avec un foreach.
Pour l'envoie du form, il faut mettre un <input type="submit" value="Texte" /> puis préciser le script PHP dans l'attribut action de la balise form.

Réponse 2 / 22

Tu pourrais me montré comment utiliser le foreach stp un exemple merci avion ^^

Réponse 3 / 22

avion-f16 Messages postés 20367 Statut Contributeur 4 509

https://www.php.net/manual/fr/control-structures.foreach.php
https://openclassrooms.com/fr/courses#ss_part_1 (descends un peu)

Réponse 4 / 22

Qu-est-ce que je dois mettre dans la boucle foreach ?

je commence comme ceci c bien ca ?

foreach($_POST['diplome'])
{

// je met quoi ici pour envoyer les donnée entrés dans la base ?

}

Vous n’avez pas trouvé la réponse que vous recherchez ?

Posez votre question

Réponse 5 / 22

avion-f16 Messages postés 20367 Statut Contributeur 4 509

$i = 0;
foreach($_POST['diplome'] as $valeur) {
echo 'diplome['.$i.'] = '.$valeur.'<br />';
$i++;
}

Réponse 6 / 22

j'ai une erreur :

Notice: Undefined index: diplome in D:\EasyPHP5.3.0\www\test\JS2.php on line 17

Warning: Invalid argument supplied for foreach() in D:\EasyPHP5.3.0\www\test\JS2.php on line 17
?>

il faut que je valide le bouton pour qu'il maffiche les valeurs ?

Réponse 7 / 22

avion-f16 Messages postés 20367 Statut Contributeur 4 509

Pour éviter l'erreur fais une condition :

if(!empty($_POST['diplome'])) {
    $i = 0; 
    foreach($_POST['diplome'] as $valeur) { 
        echo 'diplome['.$i.'] = '.$valeur.'<br />'; 
        $i++; 
    }
}

Ok et la ca va ajouté le résultat dans la base directement mai comment les nouveau champs vont se crée ds la base ? diplome1 diiplome2.. par exemple

Réponse 8 / 22

avion-f16 Messages postés 20367 Statut Contributeur 4 509

En mettant des crochets comme je l'ai dit dans le premier message, $_POST['diplomes'] sera un array (tout comme $_POST en est un, qui contient le clé 'diplomes').

g un pb sa marche pas l'insertion test regarde : (corp-cv.php)
<!doctype html public "-//w3c//dtd html 4.0 transitional//en">
<html>
<form id = "form_inscription" action="traitement_cv.php" method=post>

<input type="hidden" name="id" value=" <?php echo($result->id) ;?>">
<div id="corps">

<fieldset>
<legend><b>Formation suivie</b></legend>

<p><label for="nom_etab">Nom de l'etablissement:</label><input type="text" name = "nom_etab" id="diplome" /><br /></p>

<p><label for="specialisation">Specialite/section:</label><input type="text" name = "specialite" id="specialisation" /><br /></p>
<fieldset id="zone_text">

<p><label for="diplome">Diplomes:</label><input type="text" name="diplome" id="diplome" /><br /></p>
<p class="lien"<a href="#" onClick="javascript:add()">Ajouter un diplome<a></p>
</fieldset>
<script type="text/javascript">
add();
</script>

<?php

if(!empty($_POST['diplome']))
{
$i = 0;
foreach($_POST['diplome'] as $valeur)
{
echo 'diplome['.$i.'] = '.$valeur.'<br />';
$i++;
}
}

?>
<p><label for="annee">Annee</label><input type="text" name = "annee" id="annee" /> <br /></p></p>

Commentaires :
<br><TEXTAREA name="com" rows=10 COLS=50></TEXTAREA> </br>

</fieldset>
<br />

<fieldset>
<legend><b>Profession</b></legend> <br />
<p><label for="entreprise">Entreprise actuelle :</label><input type="text" name = "entreprise" id="entreprise" /> <br /></p></p>
<p><label for="fonction">Fonction actuelle :</label><input type="text" name = "fonction" id="fonction" /> <br /></p></p>
<p><label for="secteur">Secteur d'activite :</label><input type="text" name = "secteur" id="secteur" /> <br /></p></p>
<p><label for="adresse_pro"> Adresse professionnelle :</label><input type="text" name = "adresse_pro" id="adresse_pro" /> <br /></p></p>
<p><label for="tel_pro"> Telephone professionnel :</label><input type="text" name = "tel_pro" id="annee" /> <br /></p></p>
<p><label for="email_pro"> Email professionnel :</label><input type="text" name = "email_pro" id="email_pro" /> <br /></p></p>

</fieldset>
<br />

<center><input type="submit" value="Ajouter" /></center>
</div>
</form>

<script type="text/javascript">

function refresh(event){
//On sélectionne le premier et le deuxième fieldset
var liste = document.getElementById("liste_deroulante");
var text_fieldset = document.getElementById("zone_text");

//On récupère la position de notre champ texte
var node_source = (document.all)?event.srcElement:event.target;
var position = node_source.previousSibling.nodeValue.split(" ")[1];

//On récupère la valeur dans la champ texte
var labels = text_fieldset.getElementsByTagName("label");
var label = labels[position-1];
var input = label.getElementsByTagName("input")[0];

}

function del(event){
//on sélectionne le premier fieldset et on récupère tous les label qu'il y a à l'intérieur
var text_fieldset = document.getElementById("zone_text");
var labels = text_fieldset.getElementsByTagName("label");

//On récupère le noeud qui émet l'évènement et sa position grâce au texte Valeur x
var node_source = (document.all)?event.srcElement:event.target;
var position = node_source.previousSibling.firstChild.nodeValue.split(" ")[1];

//On décale d'un cran inférieur tous les éléments situés après l'élément à supprimer
for(var i=position;i<labels.length;i++){
var label = labels[i];
var input = label.getElementsByTagName("input")[0];

input.setAttribute("name","diplome"+i);

label.firstChild.nodeValue = "Diplome "+i+" ";
}

//Suppression de la zone de texte, du lien et du saut de ligne
var label = labels[position-1];
var lien = label.nextSibling;
var br = lien.nextSibling;
text_fieldset.removeChild(label);
text_fieldset.removeChild(lien);
text_fieldset.removeChild(br);

}

function add(){
//On compte le nombre de label et on sélectionne le premier fieldset
var count = document.getElementsByTagName("label").length;
var text_fieldset = document.getElementById("zone_text");
count ++;

//création du label( <label>Valeur x <input type="text" name="nomx" value="" /></label>)
var input = document.createElement("input");
input.setAttribute("type","text");
input.setAttribute("name","diplome"+count);
input.setAttribute("value","");

if(document.all) input.attachEvent("onkeyup",refresh);
else input.addEventListener("keyup",refresh,true);

var nom_label = document.createTextNode("Diplome "+count+" ");
var label = document.createElement("label");
label.appendChild(nom_label);
label.appendChild(input);

//Création des élement br et p ( <p class="lien">Supprimer</p><br /> )
var br = document.createElement("br");
var del_text = document.createTextNode("Supprimer");
var lien_del = document.createElement("p");
lien_del.setAttribute("class","lien");
lien_del.setAttribute("className","lien");

if(document.all) lien_del.attachEvent("onmouseup",del);
else lien_del.addEventListener("mouseup",del,true);

lien_del.appendChild(del_text);

//On raccroche ici tous nos éléments virtuels à une balise de notre fichier XHTML. Ils sont alors affichés
text_fieldset.appendChild(label);
text_fieldset.appendChild(lien_del);
text_fieldset.appendChild(br);

}
</script>

code de la page traitement_cv.php :
<?php

include('connect_bdd.php');

@$fonction = $_POST['fonction'];
@ $diplome = $_POST['diplome'];
@ $specialite = $_POST['specialite'];
@ $nom_etab = $_POST['nom_etab'];
@ $annee = $_POST['annee'];
@ $entreprise = $_POST['entreprise'];
@ $secteur = $_POST['secteur'];
@ $entreprise = $_POST['entreprise'];
@ $adresse_pro = $_POST['adresse_pro'];
@ $tel_pro = $_POST['tel_pro'];
@ $email_pro = $_POST['email_pro'];

$id = $_POST['id'];

$interro = "insert into cv
values ('','$nom_etab','$specialite','$diplome','$annee','$entreprise','$fonction','$secteur','$adresse_pro','$tel_pro','$email_pro','$id')";

$resultat = mysql_query($interro) or die (mysql_error());

if (! $resultat)
{
echo "Pas enregistré";
}
else
{
echo " Cv ajouter";
echo '<p align="left"><a href = "index.php"> retour a lacceuil</a>';
}

exit;

?>

Réponse 9 / 22

avion-f16 Messages postés 20367 Statut Contributeur 4 509

Lis mon premier message !
Il faut mettre des crochets à la fin du name !

Réponse 10 / 22

<p><label for="diplome">Diplomes:</label><input type="text" name="[diplome]" id="diplome" />

comme sa ??

Réponse 11 / 22

avion-f16 Messages postés 20367 Statut Contributeur 4 509

Non, tu ajoutes "[]" à la fin, après "diplome"
Comme ceci : name="diplomes[]"

Réponse 12 / 22

Il me met Array ds le champ diplome ds la base comment ça se fait ?

Réponse 13 / 22

avion-f16 Messages postés 20367 Statut Contributeur 4 509

Parce que c'est un tableau ...
Il faut que tu utilises une boucle Foreach.
Pour info, je t'ai déjà tout expliqué plus haut !!!

Réponse 14 / 22

Je sais je l'ai faite la boucle foreach..

Réponse 15 / 22

avion-f16 Messages postés 20367 Statut Contributeur 4 509

Mais il faut que tu génères ce que tu as besoin !

Réponse 16 / 22

Sérieux jcompren pa tro je débute comme tu peu le voir ! lol tu peu me montré plz ?

Réponse 17 / 22

avion-f16 Messages postés 20367 Statut Contributeur 4 509

Te montrer quoi ?
Retournes sur le Siteduzero, apparemment tu as sauté la moitié des chapitres !

Lool non g vu sur le foreach il faut rajouter koi en + ?

if(!empty($_POST['diplome']))
{
$i = 0;
foreach($_POST['diplome'] as $valeur)
{
echo 'diplome['.$i.'] = '.$valeur.'<br />';
$i++;
}
}

jm > jm

Tas msn ?

Réponse 18 / 22

avion-f16 Messages postés 20367 Statut Contributeur 4 509

Mais tu veux faire quoi avec les données ?
Tout mettre dans un champ ?
Je n'ai pas de boule en cristal moi !!!

Réponse 19 / 22

nan je veux que sa rajoute un champ ' diplome i ' ds la base a chak foi ke jen rajoute un de + ! c possible ou pa ?

Réponse 20 / 22

avion-f16 Messages postés 20367 Statut Contributeur 4 509

Oui, tu crées une table 'diplomes' par exemple avec les champs qu'il te faut.
Et dans la boucle foreach, tu fais un mysql_query pour chaque champ.
Ce que tu mets dans foreach sera exécuté pour chaque champ avec $valeur ayant sa valeur.

Discussions similaires

Civilité (Mr,Mme,Melle) n' apparait pas lors de l'exécution du formulaire

java script error in the main process

Contact LEBONCOIN

Contacter le "bon coin"

probleme avec formulaire et sous formulaire independant.

Votre réponse

Discussions similaires