Cases à cocher et actualisation page

Icho -  
lewis34 Messages postés 2557 Date d'inscription   Statut Membre Dernière intervention   -
Bonjour,

Je ne sais pas par ou démarrer ^^

J'ai dans ma page 10 cases à cocher nommées respectivement Checbox1 à Checbox10. Chacune fait référence à un article dont le prix est Prix1 à Prix10.

Je voudrais que llorsque l'on coche ou décoche une case cela :

- Vide la liste des produits choisis

- Recopie les noms des produits dans la liste (Produit1 à Produit10)

- Recalcule la zone "Total"

- Réactualise la page

Je patauge pour démarrer ce petit module. J'espère que vous m'aurez compris.

Merci

Icho
Configuration: Windows Vista Internet Explorer 8.0

3 réponses

  1. Icho
     
    J'ai un peu avancé dans le sens ou j'arrive à réactulaiser la page quand je clique sur l'une des cases à cocher.

    Maisle clic ne coche ni ne décoche la case.

    Mon code simplifié, et merci de votre aide

    <Head>

    <script language="JavaScript">
    <!--
    var sURL = unescape(window.location.pathname);

    function refresh()
    {
    window.location.href = sURL;
    }
    //-->
    </script>

    <script language="JavaScript1.1">
    <!--
    function refresh()
    {
    window.location.replace( sURL );
    }
    //-->
    </script>

    <script language="JavaScript1.2">
    <!--
    function refresh()
    {
    window.location.reload( false );
    }
    //-->
    </script>

    </HEAD>

    <body bgcolor="ffffff">

    <form method="GET" action="Affiliate-Shareware.cfm">>

    <input name="INT9" type="checkbox" id="INT9" onclick="refresh()" value="checkbox">
    <input name="FR9" type="checkbox" id="FR9" onclick="refresh()" value="checkbox">
    </form>
    </body>
    0
  2. mugen23 Messages postés 133 Statut Membre 2
     
    pas besoin de rafraichir, fais plutôt une fonction qui supprimera l'élément décoché.

    toujours avec un onclick tu appelle ta fonction.
    0
  3. lewis34 Messages postés 2557 Date d'inscription   Statut Membre Dernière intervention   352
     
    tu a 2 possibilité soit tu utilise ajax pour traiter les infos soit plus "bricolo" tu utilise des champs caché et le javascript
    un petit exemple tapé en 2-2
    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
    <html xmlns="http://www.w3.org/1999/xhtml">
    <head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <title>Document sans nom</title>
    
    <script type="text/javascript">
    function comptechecbox()
    {
     var checkboxCount = 0;
      var checkedCount = 0;
      var tot=0;
    
      
       for (var i=0; i<document.forms[0].elements.length; i++)
        {
        var e = document.forms[0].elements[i];
        if( e.type == 'checkbox' )
    	{
    	tot++;         
            }
       }
       
       return tot;
    }
    
    
    
    
    function maj(valeur)
    {
    //on va deja compte le nbr de chkbx dans ton formulaire
    n=comptechecbox();
    /*
    la on recupere la valeur de la checbox coché
    j'ai ajouté un separatuer _ pour pouvoir identifier dequel checbox provien l'info
    */
    /*on declare le tableau qui va contenir le resultat */
    var tab=Array();
    /*on decoupe la chaine avec le separateur _ */
    tab=valeur.split("_");
    /* le premier correspon a l'indice de la checbox coché*/
    var indice=tab[0];
    /* le secon au produit*/
    var produit=tab[1];
    
    /*ensuite tu peut traiter comme tu veut le resultat, suivant ce que tu souhaite*/
    /* en faisant une boucle*/
    	for(i=0;i<n;i++)
    	{
    		if(i==indice)
    		{
    		document.getElementById("res" + i).value=produit;
                    document.getElementById("chk" + i).cheked=true;
    		}
    	}
    
    /* ou en attribuant direcrement la valeur au champs cache*/
    	document.getElementById("res" + indice).value=produit;
    	/* ensuite tu fait tes traitements..*/
    
    }
    </script>
    </head>
    
    <body>
    produit 1<input type="checkbox" name="chk1" id="chk1" value="1_tonproduit" onclick="maj(this.value);" />
    <input type="hidden" name="res1" id="res1" value=""/>
    produit 2<input type="checkbox" name="chk2" id="chk2" value="2_tonproduit" onclick="maj(this.value);" />
    <input type="hidden" name="res2" id="res2" value=""/>
    produit 3<input type="checkbox" name="chk3" id="chk1" value="3_tonproduit" onclick="maj(this.value);" />
    <input type="hidden" name="res3" id="res1" value=""/>
    </body>
    </html>
    


    j'ai pas testé .Ce n'est qu'un exemple rapidement fait
    Pense aussi si tu a firefox a utiliser la console, tu verra ou ca plante dans le javascript
    0