10362 sujets

JavaScript, DOM et API Web HTML5

Bonjour,

Je rencontre le problème suivant :

J'ai créé un formulaire (dynamique) qui liste le contenu d'un panier et comporte une ou plusieurs lignes d'informations dont un champ <input type=text" onchange="mon JScript" Value="la quantité actuelle" size=1>

Ma fonction JavaScript effectue un window.location.assign(href) où href passe trois paramètres à ma page (du genre index.php?tache=modification&pan_id=102&quantite=5 ).

Le problème que je rencontre se situe au niveau de la validation du champ de saisie et ne se produit que lorsque mon formulaire ne comporte qu'une ligne (donc un seul champ input [hormis les champs "hidden"]). Lorsque le formulaire comporte plus d'une ligne, tout fonctionne comme il se doit.

La fonction window.location.assign(href) du JavaScript ne passe pas les paramètres lorsque le champ input a été validé avec la touche <Entrée> du clavier. Par contre, si ce champ est validé par la touche <Tabulation>, cela fonctionne. Il faut savoir que l'évènement "onChange" fonctionne correctement et appelle bien la fonction JS avec les bons paramètres.

Je ne vois pas où se situe le problème. Je mets ci-après le code du formulaire et du JavaScript (les deux lignes 'alert' et la ligne 'beep' en retrait servent à la mise au point uniquement).

Si quelqu'un pouvait m'aider, ce serait sympa.

D'avance merci de votre soutien.

Jean-Claude.


<script language="javascript">
function modif_qte(s, pan_id) {
var quantite = s.value;
  beep(100,660,50);
  alert('obj name=' + s.name + ' ; qte=' + quantite + ' ; pan_id=' + pan_id);
href = 'index.php?module=panier&tache=modification&pan_id=' + pan_id + '&quantite=' + quantite;
  alert(href);
window.location.assign(href);
}
</script>

<h2><u>Votre panier</u></h2>
<p>
 <FORM action="index.php" method="post" name="panier">
  <INPUT name="module" type=hidden value="panier">
  <INPUT name="tache" type=hidden value="modification">
  <table border="1" align="center" width="100%" class="panier" cellspacing="1">
   <tr>
    <th width="15%">&nbsp;</th>
    <th width="50%">Produit</th>
    <th align="center">Quantité</th>
    <th width="10%" style="text-align:right; margin-right:10px;">Prix unitaire&nbsp;</th>
    <th align="right" width="12%" style="text-align:right; margin-right:10px;">Prix TTC&nbsp;</th>
   </tr>
   <tr class="ligne_panier">
    <td align="center">
     <a href="index.php?module=panier&tache=suppression&pan_id=102">Supprimer</a>
    </td>
    <td>
     &nbsp;Mon bouquin
    </td>
    <td align="center">
     <input TYPE="text" onchange="javascript:modif_qte(this,102)" NAME="pan_id_102" size="1" VALUE="9">
    </td>
    <td align="right" style="text-align:right; margin-right:10px;">
     16.00 &euro;&nbsp>
    </td>
    <td align="right" style="text-align:right; margin-right:10px;">
     144.00 &euro;&nbsp;
    </td>
   </tr>
   <tr class="ligne_total">
    <td class="ligne_total" colspan="2" align="right">
     Total&nbsp;
    </td>
    <td class="ligne_total" align="right" style="text-align:right; margin-right:10px;">
     9 article(s)&nbsp;
    </td>
    <td class="ligne_total">
     &nbsp;
    </td>
    <td class="ligne_total" align="right" style="text-align:right; margin-right:10px;">
     144.00 &euro;&nbsp;
    </td>
   </tr>
  </table>
 </form>
 <br>
 <table width="100%">
  <tr>
   <td align="center" width="15%">
    <a href="index.php?module=panier&tache=vider">Vider le panier</a>
   </td>
   <td align="center" style="font-size:16px">
    <strong><a href="index.php?module=commande">&gt;&gt; Commander </a></strong>
   </td>
  </tr>
 </table>
</p>