Partage
  • Partager sur Facebook
  • Partager sur Twitter

Récupérer variables $_GET en ajax

    10 juillet 2018 à 14:27:28

    Bonjour,

    Je ne suis pas très à l'aise avec ajax mais malheureusement ici je ne vois pas d'autres solutions.
    J'utilise le script de : https://www.johnmorrisonline.com/jquery-tutorial-ajax-load-content-with-no-page-refresh/

    Pour expliquer ma situation, j'arrive sur la page contactdetails.php avec 2 variables qui me sont indispensables pour exécuter mes différentes requêtes :

    // get userid
    if (isset($_SESSION["username"])):
    	$userid = $_SESSION["userid"];
    endif;
    
    // get date & newsletterid
    $contactid = $_GET['contactid'];

    Ma page contactdetails.php (simplifié)

    <?php
    session_start();
    require ("config/connect.php");
    
    // get userid
    if (isset($_SESSION["username"])):
    	$userid = $_SESSION["userid"];
    endif;
    
    // get date & newsletterid
    $contactid = $_GET['contactid'];
    
    ?>
    <!DOCTYPE html>
    <html>
    <head>
    	<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" /> 
    	<meta name="viewport" content="width=device-width, initial-scale=1">
    	<link rel="stylesheet" type="text/css" media="all" href="css/style.css"/>
    	<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
    </head>
    <body>
    	<?php include("menu.php");?>
    	
    	<div id="page">
    
    		 <nav id="nav">
    			<ul>
    				<li><a href="#" data-target="contactdetails_comments">Comments</a></li>
    				<li><a href="#" data-target="contactdetails_emailings">Emailing</a></li>
    			</ul>
    			</nav>
    			<div id="content_more">
    			
    			</div>
    	</div>
    <script>
          $(document).ready(function(){
            // Set trigger and container variables
            var trigger = $('#nav ul li a'),
                container = $('#content_more');
            
            // Fire on click
            trigger.on('click', function(){
              // Set $this for re-use. Set target from data attribute
              var $this = $(this),
                target = $this.data('target');       
              
              // Load target page into container
              container.load(target + '.php');
              
              // Stop normal link behavior
              return false;
            });
          });
    </script>	
    </body>
    </html>
    

    Bien que les pages se charges dans contactdetails.php, les variables ne sont pas pris en compte :(

    Du coup j'aurai besoin de votre aide pour comprendre comment passer ces variables en ajax.

    Est ce que quelqu'un pourrait me donner une piste partant de ce script (qui me semble pas mal et pas trop lourd) ?

    Merci

    • Partager sur Facebook
    • Partager sur Twitter
      10 juillet 2018 à 14:52:00

      Lors d'un requête ajax, avec JQuery tu peut spécifier "type" ("GET" ou "POST" [etc]) et également "data" qui permet d'envoyer des variables, paramètre et j'en passe :p

      Un petit exemple tout simple : 

      $.ajax({
         type: "GET",
         url: `monurl.com`,
         data: {'param1': 'valeur1', 'paramVariable': maVariable},
         success: (data)=> {
            console.log(data);
            //Mon resultat
         },
         error: (e)=> {
            console.log(e);
         }
      });
      • Partager sur Facebook
      • Partager sur Twitter
        10 juillet 2018 à 15:38:09

        Merci d'avoir pris le temps de répondre :)

        Par contre je suis vraiment novice ++ en js du coup je n'ai pas de résultat sur l'intégration de ton code (je m'en doutais un peu pour le premier essai :p)

        voilà mon script màj

        <?php
        session_start();
        require ("config/connect.php");
         
        // get userid
        if (isset($_SESSION["username"])):
            $userid = $_SESSION["userid"];
        endif;
         
        // get date & newsletterid
        $contactid = $_GET['contactid'];
         
        ?>
        <!DOCTYPE html>
        <html>
        <head>
            <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
            <meta name="viewport" content="width=device-width, initial-scale=1">
            <link rel="stylesheet" type="text/css" media="all" href="css/style.css"/>
            <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
        </head>
        <body>
            <?php include("menu.php");?>
             
            <div id="page">
         
                 <nav id="nav">
                    <ul>
                        <li><a href="#" data-target="contactdetails_comments">Comments</a></li>
                        <li><a href="#" data-target="contactdetails_emailings">Emailing</a></li>
                    </ul>
                    </nav>
                    <div id="content_more">
                     
                    </div>
            </div>
        <script>
              $(document).ready(function(){
                // Set trigger and container variables
                var trigger = $('#nav ul li a'),
                    container = $('#content_more');
                 
                // Fire on click
                trigger.on('click', function(){
                  // Set $this for re-use. Set target from data attribute
                  var $this = $(this),
                    target = $this.data('target');      
                   
                  // Load target page into container
                  container.load(target + '.php');
                   
                  // Stop normal link behavior
                  return false;
                });
              })
        	  
        	  $.ajax({
        	   type: "GET",
        	   url: 'contactdetails.php',
        	   data: {'userid': $_SESSION["userid"], 'contactid': $_GET['contactid']},
        	   success: (data)=> {
        		  console.log(data);
        		  //Mon resultat
        	   },
        	   error: (e)=> {
        		  console.log(e);
        	   }
        	});
        </script>
        </body>
        </html>

        Si j'ai bien compris je met l'url où sont présent mes variables PHP donc : contactdetails.php

        Pour data je mets mes variables sous la forme {'paramVariable1': maVariable1, 'paramVariable2': maVariable2} ?

        Je n'ai aucun retour de la console mais je pense que ça c'est dû à ma mauvaise intégration de ton script sur le script existant? :-°

        • Partager sur Facebook
        • Partager sur Twitter
          10 juillet 2018 à 18:25:47

          Tu utilise des variables php au lieu de variable JS, tu veut faire quoi ?
          Envoyer des données vers la pages contactdetails.php ou en recevoir ?

          • Partager sur Facebook
          • Partager sur Twitter
            10 juillet 2018 à 21:25:18

            en fait je pars d’une page contact.php qui liste tout les Contacts sur lesquels il y a un lien type contactdetails.php?contactid=$contactid .

            sur la page contactdetail.php avec un GET je récupère cet id + id de session userid.

            je voudrais que la page contactdetail.php, récupérer en ajax le contenu d’une page par exemple contactdetails_comments.php où sont mes requêtes de commentaires sur ce contact, pour ça il me faut les 2 variables contactid et userid.

            le soucis comme t’as pu le constater j’ai du mal avec javascript pour transferer mes variables.

            est-ce que c’est faisable avec ce script que j’ai trouvé ou c’est une mauvaise piste?

            je regarde pas mal de vidéo pour tenter de comprendre mais j’ai du mal à tout saisir et surtout à l’adapter à ce bout de code qui me semblait bien :)

            • Partager sur Facebook
            • Partager sur Twitter
              10 juillet 2018 à 22:20:34

              Salut, si tu veux récupérer des variables php dans le js, je te conseille de faire une div cachée qui prendra ces valeurs dans un attribut personnalisé(de type data-tonNomDAttribut). Ensuite, pour ce qui est du passage de variable, si tu veux les passer dans l'url, tu peux directement les passer dans la requête ajax, si tu veux les passer en post tu peux les passer via l'attribut data. 

              Un exemple pour l'url :

              $.ajax({
                     type: "GET",
                     url: 'contactdetails.php?' + 'var1 ='  + val1,
                     success: (data)=> {
                        console.log(data);
                        //Mon resultat
                     },
                     error: (e)=> {
                        console.log(e);
                     }
                  });

              Après, n'oublie pas que la requête ajax se stoppe au premier echo rencontré dans la page php.
              J'espère avoir bien saisi ton problème et n'hésite pas à revenir si tu as besoin d'aide.

              -
              Edité par Melin Alexandre 10 juillet 2018 à 22:21:00

              • Partager sur Facebook
              • Partager sur Twitter
                11 juillet 2018 à 10:06:32

                Bonjour Alexandre,

                Merci pour ta réponse, mais du coup je pense que je n'ai pas été très clair dans mon explication :)

                Je souhaite que lorsque je clique sur :

                <a href="#" data-target="contactdetails_comments">Comments</a>

                je puisse exploiter les variables présentes en PHP de userid et contactid dans deux GET dans la page contactdetails.php.

                Du coup actuellement quand j'appelle la page contactdetails_comment.php dans

                <div id="content_more">
                
                </div>

                J'ai l'erreur "Notice: Undefined index: contactid in" (je ne m'attendais pas à ça je pensais qu'étant donné que la page contactdetails_comment.php serait appelé dans un DIV de contactdetails.php que du coup mes variables seraient directement inclus.. mais non :D)

                Du coup je pense qu'il faut que j'arrive à ajouter mes 2 variables contactid et userid dans le lien avec ajax mais que je puisse par la suite sur la page contactdetails_comment les exploiter avec du PHP car l'ajax ce n'est vraiment pas mon truc au final :euh:

                <a href="#" data-target="contactdetails_comments">Comments</a>


                Je précise tout ça parce que je ne comprends pas ceci dans ton explication :

                url: 'contactdetails.php?' + 'var1 ='  + val1

                dans url je dois quand même mettre l'url de la page présente avec les variables et non de la page de destination ?

                J'espère que mon objectif est clair sinon je tâcherai d'expliquer mon problème autrement.

                Merci :)


                -
                Edité par richard2 11 juillet 2018 à 10:40:18

                • Partager sur Facebook
                • Partager sur Twitter
                  11 juillet 2018 à 13:47:55

                  C'est très sale de parser directement des variables dans une url alors que JQuery le fait déjà via la clé/méthode "data".

                  En gros, tu souhaite utilisé une variable php en javascript. Moi ce que je te suggére c'est d'utiliser get_defined_vars, de le json_encode puis de crée en début de ton document un input[type="hidden"] dont la valeur serait le JSON.
                   - http://php.net/manual/fr/function.get-defined-vars.php
                   - http://php.net/manual/fr/function.json-decode.php
                   - https://developer.mozilla.org/fr/docs/Web/HTML/Element/Input/hidden

                  <html>
                     <head></head>
                     <body>
                  <input id="var" name="var" type="hidden" value="<?php
                     echo json_encode(get_defined_vars());
                  ?>">
                        <script>
                  var php$ = JSON.parse($('input#var').val());
                  console.log(php$); //Tu regarde ensuite dans ta console 
                  // l'architecture des variables, et tu utilise les variables
                  // dont tu as besoin là ou tu en as besoin
                        </script>
                     </body>
                  </html>

                  En temps que développeuse je te conseil d'utiliser une pages vierge spécialement conçut pour tes tests, ainsi tu pourra prendre connaissance plus simplement des différents mécanisme des deux langage ainsi que les moyens d'échange possible entre les deux. Pour une fois le mécanisme compris l'exploiter au sein d'un code fonctionnel :p

                  Je tiens a te rappeler que javascript est un langage coter client et que php est un langage serveur, les interactions entre les deux langage est donc par définitions relativement compliquer :D Mais heureusement pas impossible.

                  Si tu souhaite récupérer des variables php, (notamment de session par exemple) je te conseil de passer par une API.
                  Une api ne retourne pas une pages destiner a être lue par un humain, mais par une machine.
                  A l'inverse, si tu souhaite exploiter une variable javascript dans un script php il y a une méthode "propre&simple" les requêtes (get, post etc) synchrone ou asynchrone avec ou non redirections. (ajax, formulaire, etc)

                  Si tu souhaite en savoir un peu plus sur les api, ou que je ne t'ai pas apporter la réponse que tu souhaitais je t'invite a me contacter sur discord où je suis beaucoup plus active (@Leeloo#9187).

                  -
                  Edité par Leeloominaï 11 juillet 2018 à 13:51:03

                  • Partager sur Facebook
                  • Partager sur Twitter

                  Récupérer variables $_GET en ajax

                  × Après avoir cliqué sur "Répondre" vous serez invité à vous connecter pour que votre message soit publié.
                  × Attention, ce sujet est très ancien. Le déterrer n'est pas forcément approprié. Nous te conseillons de créer un nouveau sujet pour poser ta question.
                  • Editeur
                  • Markdown