IdentifiantMot de passe
Loading...
Mot de passe oublié ?Je m'inscris ! (gratuit)
Navigation

Inscrivez-vous gratuitement
pour pouvoir participer, suivre les réponses en temps réel, voter pour les messages, poser vos propres questions et recevoir la newsletter

JavaScript Discussion :

[AJAX] Simuler un onclick pour envoi de données


Sujet :

JavaScript

  1. #1
    Nouveau candidat au Club
    Profil pro
    Inscrit en
    Décembre 2008
    Messages
    2
    Détails du profil
    Informations personnelles :
    Localisation : France

    Informations forums :
    Inscription : Décembre 2008
    Messages : 2
    Par défaut [AJAX] Simuler un onclick pour envoi de données
    Bonjour à tous.

    Je débute en AJAX et je bute sur un truc.

    J'utilise 2 fonctions que voici :
    Code : Sélectionner tout - Visualiser dans une fenêtre à part
    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    12
    13
    14
    15
    16
    17
    18
    19
    20
    21
    22
    23
    24
    25
    26
    27
    28
    29
    30
    31
    32
    33
    34
    35
    36
    37
    38
    39
    40
    41
    42
    43
    44
    45
    46
    47
    48
    49
    50
    51
    function sendData(data, page, method, loc) {    
        if(document.all) { //Internet Explorer
            var XhrObj = new ActiveXObject("Microsoft.XMLHTTP") ;
        }
        else { //Mozilla
            var XhrObj = new XMLHttpRequest();
        }
     
        //définition de l'endroit d'affichage:
        var content = document.getElementById(loc);
     
        //si on envoie par la méthode GET:
        if(method == "GET") {
            if(data == 'null') {
                //Ouverture du fichier sélectionné:
                XhrObj.open("GET", page);
            }
            else {
                //Ouverture du fichier en methode GET
                XhrObj.open("GET", page+"?"+data);
            }
        }//fin if
        else if(method == "POST") {
            //Ouverture du fichier en methode POST
            XhrObj.open("POST", page);
        }//fin elseif
     
        //Ok pour la page cible
        XhrObj.onreadystatechange = function() {
            if (XhrObj.readyState == 4 && XhrObj.status == 200){
                content.innerHTML = XhrObj.responseText;
            }
        }    
     
        if(method == "GET") {
            XhrObj.send(null);
        }
        else if(method == "POST") {
            XhrObj.setRequestHeader('Content-Type','application/x-www-form-urlencoded');
            XhrObj.send(data);
        }//fin elseif
     
    }//fin fonction SendData 
     
    function changeProduit(taille, couleur, id_cat, qte) {
        sendData('taille='+taille+'&couleur='+couleur+'&id_cat='+id_cat+'&qte='+qte, 'taille_ajax.php', 'POST', 'id_taille');
        sendData('taille='+taille+'&couleur='+couleur+'&id_cat='+id_cat+'&qte='+qte, 'couleur_ajax.php', 'POST', 'id_couleur');
        sendData('taille='+taille+'&couleur='+couleur+'&id_cat='+id_cat+'&qte='+qte, 'bouton_ajax.php', 'POST', 'bouton_acheter');
        sendData('taille='+taille+'&couleur='+couleur+'&id_cat='+id_cat+'&qte='+qte, 'photo_ajax.php', 'POST', 'id_photo');
        sendData('taille='+taille+'&couleur='+couleur+'&id_cat='+id_cat+'&qte='+qte, 'form_ajax.php', 'POST', 'id_lien');
    }
    Puis, dans la page qui démarre l'ajax, j'ai :
    Code php : Sélectionner tout - Visualiser dans une fenêtre à part
    1
    2
    3
    4
    5
    6
    echo "<FORM name=\"choix_taille_couleur\" method=\"POST\" action=\"".$_SERVER["REQUEST_URI"]."\">";
    echo "<div id=\"id_taille\"><a href=\"javascript:void(0);\" onClick=\"changeProduit('".$code_prod."', '".$code_prod."', '".$id_cat."', '1');\" />Cliquer pour choisir couleur et taille</a></div>";
    echo "<div id=\"id_taille\"></div>";
    echo "<div id=\"id_couleur\"></div>";
    echo "<div id=\"bouton_acheter\"></div>";
    echo "</FORM>";

    Mon but est que lorsque la page s'affiche, la fonction changeProduit() soit exécutee une première fois, sans intervention de l'internaute.
    J'ai voulu essayer ceci :
    Code php : Sélectionner tout - Visualiser dans une fenêtre à part
    1
    2
    3
    4
    5
    echo "<script language=\"JavaScript\">"."\n";
    echo "<!--"."\n";
    echo "changeProduit(\"".$code_prod."\", \"".$code_prod."\", \"".$id_cat."\", \"1\");"."\n";
    echo "// -->"."\n";
    echo "</script>"."\n";
    Mais j'ai une erreur dans la fonction sendData().

    J'ai donc dû mettre ceci :
    Code php : Sélectionner tout - Visualiser dans une fenêtre à part
    echo "<div id=\"id_taille\"><a href=\"javascript:void(0);\" onClick=\"changeProduit('".$code_prod."', '".$code_prod."', '".$id_cat."', '1');\" />Cliquer pour choisir couleur et taille</a></div>";
    Mais franchement, c'est du bricolage et pas du tout pratique pour l'internaute.

    Comment faire donc pour que la fonction changeProduit() fonctionne au chargement de la page (et donc que la fonction sendData() qu'elle appelle fonctionne) ?

  2. #2
    Inactif  
    Avatar de Kerod
    Profil pro
    Inscrit en
    Septembre 2004
    Messages
    11 672
    Détails du profil
    Informations personnelles :
    Localisation : France

    Informations forums :
    Inscription : Septembre 2004
    Messages : 11 672
    Par défaut
    Bonjour et bienvenue sur developpez.com,

    Avant toute chose, il faut poster le code HTML généré et non le code PHP (on est dans le forum AJAX).

    Pour répondre à question, tu pourrais utiliser l'événement onload="fonction" dans la balise body.

  3. #3
    Nouveau candidat au Club
    Profil pro
    Inscrit en
    Décembre 2008
    Messages
    2
    Détails du profil
    Informations personnelles :
    Localisation : France

    Informations forums :
    Inscription : Décembre 2008
    Messages : 2
    Par défaut
    Désolé pour le PHP.

    Voici l'exemple d'une page sur laquelle je travaille :
    Page test

    Pour tout faire apparaitre, je dois cliquer sur :
    Cliquer pour choisir couleur et taille

    La solution du onload dans le body ne va pas, car ça ne doit pas se produit sur toutes les pages.

    J'ai rajouté dans ma fonction SendData :
    Code : Sélectionner tout - Visualiser dans une fenêtre à part
    1
    2
    3
    if (content != null) {
    content.innerHTML = XhrObj.responseText;
    }
    car c'est quand content vaut null que la fonction plante.

    Mais la question est pourquoi avec un onclick "content" n'est pas null alors qu'en appelant la fonction comme ceci :
    Code : Sélectionner tout - Visualiser dans une fenêtre à part
    1
    2
    3
    4
    5
    <script language=JavaScript>
    <!--
    changeProduit("code_prod", "code_prod", "id_cat", 1);
    // -->
    </script>
    il est null au moins une fois.

Discussions similaires

  1. Meilleure méthode pour envoi de données par POST
    Par Pouknouki dans le forum VB.NET
    Réponses: 4
    Dernier message: 07/03/2013, 06h13
  2. module IGMP pour envoi de donnée ?
    Par patrickElta dans le forum Embarqué
    Réponses: 0
    Dernier message: 07/11/2011, 17h41
  3. Réponses: 1
    Dernier message: 23/10/2011, 22h39
  4. [AJAX] boucle for pour envoi de données
    Par bulldo dans le forum AJAX
    Réponses: 1
    Dernier message: 28/07/2011, 10h39
  5. [AJAX] AJAX et envoie de données d'un formulaire
    Par gunderam dans le forum Général JavaScript
    Réponses: 1
    Dernier message: 14/06/2006, 18h17

Partager

Partager
  • Envoyer la discussion sur Viadeo
  • Envoyer la discussion sur Twitter
  • Envoyer la discussion sur Google
  • Envoyer la discussion sur Facebook
  • Envoyer la discussion sur Digg
  • Envoyer la discussion sur Delicious
  • Envoyer la discussion sur MySpace
  • Envoyer la discussion sur Yahoo