|
|
|
|
Bonjour,
J'aimerais insérer une fonction js qui calcul les sous-totaux dans un tableau (html) de bon de commande. Le résultat est la quantité choisie dans un menu déroulant multiplié par le prix en fonction de la quantité (3 tranches de prix pour chaque article).
Mon problème est comment récupérer les prix qui ne sont pas dans des champs. Comme c'est différent pour chaque article et qu'il peut y avoir des modifications dans l'avenir, j'aimerais pouvoir récupérer automatiquement les valeurs pour éviter de les saisir dans la fonction ou dans les paramètres.
On peut donner des id aux <td> contenant les prix et récupérer la valeur avec getelementById (j'avoue que je ne m'y connais pas bien), ou utiliser des champs cachés et recopier manuellement les prix ? Faut-il définir un tableau en javascript ? Ou est-ce qu'il vaut mieux construire une base de données ? C'est sûrement la meilleure solution à long term, mais là, j'aimerais trouver une solution la plus rapide.
Voici le tableau en question (en réalité, il y a évidemment 50 lignes !)
<html>
<form id="orderform" name="orderform" method="post" action="mailto:xxx">
<table class="pricetable" cellspacing="1" >
<tr class="titrecolonne" >
<td class="ref" >Référence</td>
<td class="nom" >Dénomination</td>
<td class="parcent">Par 100 g </td>
<td class="par5cent">Par 500 g </td>
<td class="parkilo">Par kg</td>
<td class="quantity">Quantité</td>
<td class="prix" >Sous-total</td>
</tr>
<tr>
<td class="ref">xxx</td>
<td class="nom">YYY</td>
<td class="parcent">20€</td>
<td class="par5cent">80€</td>
<td class="quantity">150€</td>
<td class="prix">
<select name="qtty_ref1" size="1" onchange="calculprix(this.value, this.name);calcultotal();">
<option value="-----">-----</option>
<option value="1">100g</option>
<option value="2">200g</option>
<option value="3">300g</option>
<option value="4">400g</option>
<option value="5">500g</option>
<option value="10">1kg</option>
<option value="15">1,5kg</option>
<option value="20">2kg</option>
</select>
</td>
<td width="73"><input name="montant_ref1" size="14" /></td>
</tr>
</table>
</form>
</html>
Deuxièmement, j'aimerais pouvoir remplacer dans la fonction qui calcule les montants:
document.orderform.montant_ref1.value=String(soustot);
par document.orderform.nom_champ_soustot.value=String(soustot);
"nom_champ_soustot" étant une variable que j'ai créé dans la même fonction (concaténation du "montant"+nom de la référence extraite du nom du champs qtty) , mais ça ne marche pas. Comment faire ???
Configuration: Windows XP Internet Explorer 7.0
Bonjour,
|
Bjr
|
Bjr
<html>
<head>
<title>Code de démonstration - Explorer un tableau HTML avec des interfaces DOM et JavaScript</title>
<style>
*
{
font-size : 10pt;
font-family : Arial;
}
</style>
<script>
function CreerTableHTML(parentId,nbrCol,nbrRow)
{
// Recherche de l'élément parent dans lequel on va insèrer la nouvelle table
var parentElt = document.getElementById(parentId);
// Efface le contenu de l'élément parent
parentElt.innerHTML="";
// Création d'une nouvelle table = élément <table>
var table = document.createElement("table");
// Donne une bordure à la table (facultatif)
table.setAttribute("border", "1");
// Création du corps de la table
var tableBody = document.createElement("tbody");
// Pour chaque ligne
for(var rowIndex = 0; rowIndex < nbrRow; rowIndex++)
{
// Création d'une nouvelle ligne= élément <tr>
var row = document.createElement("tr");
// Pour chaque colonne
for(var colIndex = 0; colIndex < nbrCol; colIndex++)
{
// Création d'une nouvelle cellule = élément <td>
var cell = document.createElement("td");
// Donne une largeur de 40 pixels à chaque cellule (facultatif)
cell.style.width= "40px";
// Centre la contenu de chaque cellule (facultatif)
cell.style.textAlign = "center";
// Contenu de la cellule
cell.innerHTML="["+colIndex+","+rowIndex+"]";
// Ajoute la cellule dans la ligne
row.appendChild(cell);
}
// Ajoute la ligne à la fin du corps du tableau
tableBody.appendChild(row);
}
// Ajoute le corps du tableau dans la table
table.appendChild(tableBody);
// Ajoute la table dans l'élément parent ... ouf !
parentElt.appendChild(table);
}
function generer()
{
var nbrCol = document.getElementById("nbrCol").value;
var nbrRow = document.getElementById("nbrRow").value;
CreerTableHTML('conteneur',nbrCol,nbrRow);
}
</script></head>
<body>
Test de création de table HTML dynamiquement avec DOM<br/><br/>
<form>
Nombre de colonnes<input type="text" value="10" id="nbrCol" size="4">
Nombre de lignes<input type="text" value="5" id="nbrRow" size="4">
<input type="button" onclick="generer()" value="Générer la table">
</form>
<div id="conteneur"></div>
</body>
</html>
Ceci est juste un ex basique et pas vraiment exploitable en l'état. Evidemment pour ton application il faut utiliser un modèle bcp plus sophistiqué à base d'objets JavaScript PhP Il y a 10 types de personnes dans le monde : ceux qui comprennent le binaire et les autres ... |
