Je suis entrain de faire un formualaire facture qui laisse la possibilité de créer des champs dynamiquement en js et pour l'instant ça marche bien.
Mon probleme c'est de recuperer les champs créer en js pour les envoyé en php, ci-joint mon script:
Code : Tout sélectionner
<?php
$design=$_POST['designs'];
$qtite=$_POST['Qte'];
$prix=$_POST['pus'];
if(isset($design))
{
print_r($design);
}
?>
<html>
<body onload="Create_Ligne(1)">
<form method="post">
<table id="fact-tablee" style="width:507px;margin-top:10px;" cellpadding="0" cellspacing="0">
<tr>
<th class="corn-fact-t-l"></th>
<th style="width:166px;">DESIGNATION</th>
<th style="width:58px;">Qté</th>
<th style="width:82px;">P.U.</th>
<th style="width:38px;">TVA</th>
<th style="width:60px;">PRIX HT</th>
<th style="width:59px;">PRIX TTC</th>
<th style="width:30px;"></th>
<th> </th>
</tr>
</table>
<table>
<tr>
<th><input type="button" onclick="Create_Ligne(1)" value="Ajouter ligne" /></th>
<th><input type="submit" onclick="Enregistrer()" value="Enregister" /> </th>
</tr>
</form>
<script langage="javascript">
//--traitement de données je doit recuperé les variable à ceniveau pour envoyer en php------
function Enregistrer(){
var i=0,
qtes,
pus,
designs,
Qte;
//-- tant que l'objet existe
qtes=document.getElementsByName('qte[]');
for(i; i< qtes.length; i++)
{
Qte = parseInt( qtes[i].value);
pus = parseFloat( document.getElementsByName('pu[]')[i].value);
designs=document.getElementsByName('designation[]')[i].value;
alert(designs);
}
}
<!-- fin -->
//----Supprimer un ligne-----//
var Compteur = 0;
//--------------------------
function Delete_Ligne( obj_){
var Parent;
var Obj = obj_;
if( Obj){
//-- tant que pas la balise <TR>
do{
Obj = Obj.parentNode;
}while( Obj.tagName != "TR")
//-- Recup du parent
Parent = Obj.parentNode;
//-- Suppression de la ligne
if( Parent){
Parent.deleteRow( Obj.rowIndex)
}
}
}
//---------Creér un ligne-------------//
function Create_Ligne(i){
//-- compteur pour le FUN
//-- Get objet tableau
var O_Table = document.getElementById('fact-tablee');
//-- Get nombre de ligne du tableau
var NbrLigne = O_Table.rows.length;
//-- Position d'insertion
var Pos = NbrLigne;
var ligne_a_creer= i;
var j;
for(j=0; j<ligne_a_creer; j++){
Compteur++;
//-- Insertion d'une ligne
O_Row = O_Table.insertRow( Pos);
//-- Insertion des cellules
O_Cell = O_Row.insertCell(-1);
O_Cell.innerHTML = '<div class="fact-b-l"></div>';
O_Cell = O_Row.insertCell(-1);
O_Cell.innerHTML = '<div align="center"><input type="text" name="designation[]" class="inp-design" value="designation n°' +Compteur +'"/></div><div class="separateur"> </div>';
O_Cell = O_Row.insertCell(-1);
O_Cell.innerHTML = '<div class="border" style="text-align:center;"><input type="text" name="qte[]" class="inp-qte" onKeyUp="Calcul()"/></div><div class="separateur"> </div>';
O_Cell = O_Row.insertCell(-1);
O_Cell.innerHTML = '<div class="border" style="text-align:center;"><input type="text" name="pu[]" class="inp-pu" onKeyUp="Calcul()"/></div><div class="separateur"> </div>';
O_Cell = O_Row.insertCell(-1);
O_Cell.innerHTML = '<div class="border" style="text-align:center;height:18px;"><input type="text" style name="tva[]" class="totaux" class="inp-pu" onKeyUp="Calcul()"/> </div><div class="separateur"> </div>';
O_Cell = O_Row.insertCell(-1);
O_Cell.innerHTML = '<div class="border" style="text-align:center;height:18px;"><input type="text" style name="montant[]" class="totaux" class="inp-pu" onKeyUp="Calcul()"/> €</div><div class="separateur"> </div>';
O_Cell = O_Row.insertCell(-1);
O_Cell.innerHTML = '<div class="border" style="text-align:center;height:18px;"><input type="text" style name="ttc[]" class="totaux" class="inp-pu" onKeyUp="Calcul()"/> € </div><div class="separateur"> </div>';
if(NbrLigne==1){
O_Cell = O_Row.insertCell(-1);
O_Cell.innerHTML = '<div class="border" style="text-align:center;height:18px;"> </div><div class="separateur"> </div>';
}
else{
O_Cell = O_Row.insertCell(-1);
O_Cell.innerHTML = '<div class="border" style="text-align:center;height:18px;"><input type="image" src="images/cross.png" onClick="Delete_Ligne(this)" /></div><div class="separateur"> </div>';
}
O_Cell = O_Row.insertCell(-1);
O_Cell.innerHTML = '<div class="fact-b-r"></div>';
}
}
</script>
</body>
</html>