Help Javascript -> Formulaire dynamique

Marsh Posté le 19-03-2009 à 10:46:12

Bonjour,

Ca faisait longtemps que j'avais pas d'asp et de JS, mais la, pour des questions de maintenance, je dois m'y remettre.
Je poste dans la cat HTML/CSS/JS parce qu'à mon avis, le problème vient de là (c'est sûr même).

Alors voilà, la base est là. Une requête SQL qui affiche une liste de tables (je sais c'est pas propre, mais SVP, ça n'est pas la question aujourd'hui, c'est du vieux code, j'ai pas le temps de tout refaire pour faire du code propre, c'est un problème urgent) contenant des champs input avec des "name" incrémentés (de type "designation_0" ).

La suite après ce code.

Code :

<div id="div_fact">
<%
Set Connect = Server.CreateObject("ADODB.Connection" )
Connect.Open Application("DSN_Chrono_SQL" )
Requete = _
"SELECT * " & _
"FROM Devis D " & _
"INNER JOIN Devis_Details DD ON D.NumeroAutoDevis = DD.NumeroAutoDevis " & _
"WHERE D.NDevis = " & NumeroDevis & " "
Set Curseur = Server.CreateObject("ADODB.RecordSet" )
Curseur.Open Requete, Connect, 3, 3
Dim i
i = 0
if not curseur.eof then
while not curseur.eof
%>
<div id="div_lig_fact_<%=i%>" style="display: block;">
<table id="tbl_<%=i%>" width="100%" align="center" cellspacing="0" cellpadding="0" border="0">
<tr>
<td width="380" align="left" style="padding-left:2px;">
<input type="text" name="designation_<%=i%>" value="<%=Curseur("Designation" )%>" maxlength="60" style="width:98%;font-weight:bold;color:#<%=Application("CouleurFond2" )%>;">
</td>
<td width="120" align="center" style="padding-right:2px;">
<input type="text" name="RefCde_<%=i%>" value="<%%>" maxlength="20" style="text-align:left;width:98%;font-weight:bold;color:#<%=Application("CouleurFond2" )%>;">
</td>
<td width="100" align="center" style="padding-right:2px;">
<input type="text" name="BonLivraison_<%=i%>" value="<%%>" maxlength="10" style="text-align:left;width:98%;font-weight:bold;color:#<%=Application("CouleurFond2" )%>;">
</td>
<td width="100" align="center" style="padding-right:2px;">
<input type="text" onblur="FormateDate(this.form.DateLivraison);" name="DateLivraison_<%=i%>" value="<%%>" maxlength="10" style="text-align:center;width:98%;font-weight:bold;color:#<%=Application("CouleurFond2" )%>;">
</td>
<td width="100" align="center" style="padding-right:2px;">
<input type="text" name="PUHT_<%=i%>" value="<%%>" maxlength="10" style="text-align:right;width:98%;font-weight:bold;color:#<%=Application("CouleurFond2" )%>;">
</td>
<td width="80" align="center" style="padding-right:2px;">
<input type="text" name="Qte_<%=i%>" value="<%%>" maxlength="10" style="text-align:right;width:98%;font-weight:bold;color:#<%=Application("CouleurFond2" )%>;">
</td>
<td width="100" align="center" style="padding-right:2px;">
<input type="text" name="montantHT_<%=i%>" value="<%=Curseur("MonHTEuro" )%>" maxlength="10" style="text-align:right;width:98%;font-weight:bold;color:#<%=Application("CouleurFond2" )%>;">
</td>
<td>
<a href="javascript:SupprimerLigne(<%=i%> );"><img src="./images/supprimer.gif" alt="Supprimer cette ligne" title="Supprimer cette ligne" border="0" /></a>
</td>
</tr>
</table>
</div>
<%
i = i + 1
curseur.movenext
wend
%><input type="hidden" id="max_lignes" name="max_lignes" value="<%=i - 1%>" /><%
else
end if
%>
</div>

En dessous de ces tables, j'ai un bouton "Ajouter une ligne" qui ajoute donc une ligne vide, même syntaxe que le code ci-dessus :

Code :

<script type="text/javascript">
function AjouterLigne()
{
var maindiv;
var newdiv;
var hid_maxlignes;
var i = 0;
var content;
//maindiv = document.forms[0].div_fact;
maindiv = document.getElementById('div_fact');
hid_maxlignes = document.getElementById('max_lignes');
i = parseInt(hid_maxlignes.value) + 1;
//alert(hid_maxlignes.value);
newdiv = document.createElement('div');
newdiv.id = 'div_lig_fact_' + i;
/* Ajout du contenu */
//content = '<div id="div_lig_fact_'+i+'">';
content = '<table id="tbl_'+i+'" width="100%" align="center" cellspacing="0" cellpadding="0" border="0">';
content += '<tr>';
content += '<td width="380" align="left" style="padding-left:2px;">';
content += '<input type="text" name="designation_'+i+'" maxlength="60" style="width:98%;font-weight:bold;color:#<%=Application("CouleurFond2" )%>;">';
content += '</td>';
content += '<td width="120" align="center" style="padding-right:2px;">';
content += '<input type="text" name="RefCde_'+i+'" maxlength="20" style="text-align:left;width:98%;font-weight:bold;color:#<%=Application("CouleurFond2" )%>;">';
content += '</td>';
content += '<td width="100" align="center" style="padding-right:2px;">';
content += '<input type="text" name="BonLivraison_'+i+'" maxlength="10" style="text-align:left;width:98%;font-weight:bold;color:#<%=Application("CouleurFond2" )%>;">';
content += '</td>';
content += '<td width="100" align="center" style="padding-right:2px;">';
content += '<input type="text" onblur="FormateDate(this.form.DateLivraison);" name="DateLivraison_'+i+'" maxlength="10" style="text-align:center;width:98%;font-weight:bold;color:#<%=Application("CouleurFond2" )%>;">';
content += '</td>';
content += '<td width="100" align="center" style="padding-right:2px;">';
content += '<input type="text" name="PUHT_'+i+'" maxlength="10" style="text-align:right;width:98%;font-weight:bold;color:#<%=Application("CouleurFond2" )%>;">';
content += '</td>';
content += '<td width="80" align="center" style="padding-right:2px;">';
content += '<input type="text" name="Qte_'+i+'" maxlength="10" style="text-align:right;width:98%;font-weight:bold;color:#<%=Application("CouleurFond2" )%>;">';
content += '</td>';
content += '<td width="100" align="center" style="padding-right:2px;">';
content += '<input type="text" name="montantHT_'+i+'" maxlength="10" style="text-align:right;width:98%;font-weight:bold;color:#<%=Application("CouleurFond2" )%>;">';
content += '</td>';
content += '<td>';
content += '<a href="javascript:SupprimerLigne('+i+');"><img src="./images/supprimer.gif" alt="Supprimer cette ligne" title="Supprimer cette ligne" border="0" /></a>';
content += '</td>';
content += '</tr>';
content += '</table>';
//newdiv.insertAdjacentHTML('BeforeEnd',content);
newdiv.innerHTML = content;
maindiv.appendChild(newdiv);
hid_maxlignes.value = i;
}
function SupprimerLigne(idligne)
{
var lig;
var tbl;
var main;
main = document.getElementById('div_fact');
lig = document.getElementById('div_lig_fact_'+idligne);
main.removeChild(lig);
lig.innerHTML = "";
}
</script>

Jusque là tout va bien, tout marche. Les lignes s'ajoutent se suppriment sans soucis (pas d'erreurs js en tout cas).
Le seul pb est que quand je valide mon formulaire (validation en post) et que je récupère les données sur une deuxième page, les champs générés à partir du javascript ne remontent pas.

Voilà le code ASP de récupération, si jamais qqn y trouve une erreur (je passe volontairement les déclarations, mais elles y sont dans mon code).

Code :

NumeroClient = Request.Form("NumClient" )
NumAdrFact = Request.Form("NumAdrFact" )
TypeFacture = Request.Form("TypeFacture" )
TxTva = Request.Form("txTva" )
DateFacture = Request.Form("DateFacture" )
DateLimitePaiement = Request.Form("DateLimitePaiement" )
Commentaires = PreparePourBdd(Request.Form("commentaires" ))
MaxLignes = Request.Form("max_lignes" )
Response.Write("Max : " & MaxLignes & "<br />" )
for i = 0 to MaxLignes
Designation = PreparePourBdd(Request.Form("designation_" & i))
PrixUnitaire = Request.Form("PUHT_" & i)
Quantite = Request.Form("Qte_" & i)
MontantHT = Request.Form("MontantHT_" & i)
RefCommande = PreparePourBdd(Request.Form("RefCde_" & i))
DateLivraison = Request.Form("DateLivraison_" & i)
BonLivraison = PreparePourBdd(Request.Form("BonLivraison_" & i))
Response.Write("-----------------<br />" )
Response.Write(i & "<br />" )
Response.Write("Designation : " & Designation & "<br />" )
Response.Write("PrixUnitaire : " & PrixUnitaire & "<br />" )
Response.Write("Quantite : " & Quantite & "<br />" )
Response.Write("MontantHT : " & MontantHT & "<br />" )
Response.Write("RefCommande : " & RefCommande & "<br />" )
Response.Write("DateLivraison : " & DateLivraison & "<br />" )
Response.Write("BonLivraison : " & BonLivraison & "<br />" )
Response.Write("-----------------<br />" )
Response.Write("<br />" )
next

Voilà, j'aurais vraiment besoin d'un coup de main.... aujourd'hui... ( [:backdafuckup] )

Merci d'avance...

Reply

Marsh Posté le 19-03-2009 à 10:46:12

Reply

Marsh Posté le 19-03-2009 à 11:13:38

Il manque pas un <form ?

J'ai lu un peu vite, je pense qu'il y a bien un form avant le code que tu as posté !?

Message édité par kao98 le 19-03-2009 à 11:17:59

---------------
Kao ..98 - Uplay (R6S) : kao98.7.62x39 - Origin (BF4, BF1) : kntkao98

Reply

Marsh Posté le 19-03-2009 à 11:19:20

Malheureusement non... Il y est et encadre bien l'ensemble de ma page (pour faire large).

De tout façon, il marche, puisque les valeurs qui sont générées par la base de données sont récupérées correctement.

Il n'y a que celles générées par le JS qui ne passent pas...

Et si je passe le form en GET, ben les valeurs générées en JS ne sont pas embarquées !

La, je comprends plus...

Reply

Marsh Posté le 19-03-2009 à 11:22:22

Apparemment, les inputs sont bien ajoutés au code html, les objets dom associés ne sont pas ajouté à l'objet représentant le form.

---------------
Kao ..98 - Uplay (R6S) : kao98.7.62x39 - Origin (BF4, BF1) : kntkao98

Reply

Marsh Posté le 19-03-2009 à 11:29:10

Et donc ? Comment on les ajoute au form ?

En fait c'est la première fois que j'utilise les objets createElement et appendChild.

Ya quelques temps j'utilisais plutot insertAdjacentHTML...

C'est ça qui foire ?

Reply

Marsh Posté le 19-03-2009 à 13:30:05

ch'ti up parce que la je galère toujours quand même....

Merci

Reply

Help Javascript -> Formulaire dynamique

Sujets relatifs:

Leave a Replay