Discussion :

[kaelig]

Bonjour,

Je suis en train d'essayer de faire un formulaire avec un autocomplete et un champs qui doit se remplir en fonction des données entrées dans le champ précédent, les données venant de la base de données et tout çà dans Worpdress...

Pour les autocomplete, pas de problème, çà marche avec Wordpress, j'ai juste ajouté un petit bout de code du type :

Code javascript :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
$("#nomPersonne").autocomplete
({
        source: 'wp-content/themes/hero-child/listePersone.php'
 
});

Et une page listePersonne comme ceci :

Code php :

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
<?php
 
include_once 'connexion.php';
 
$term = $_GET['term']; 
$requete = $link->prepare("SELECT `wp_terms`.`name` FROM `wp_term_taxonomy` JOIN `wp_terms` ON `wp_terms`.`term_id`=`wp_term_taxonomy`.`term_id`
WHERE `wp_term_taxonomy`.`taxonomy`='nomPersonne' AND `wp_terms`.`name` LIKE :term");
 
$requete->execute(array('term' => '%' . $term . '%'));
 
$array = array(); // on créé le tableau
 
while ($donnee = $requete->fetch()) { // on effectue une boucle pour obtenir les données
    array_push($array, $donnee['name']); // et on ajoute celles-ci à notre tableau
}
 
echo json_encode($array); // il n'y a plus qu'à convertir en JSON
?>

Donc, la liste des personnes apparait et lorsque l'on en sélectionne une personne (si on en trouve une qui convient), la liste des organisations qui suit devra ne lister que la(es) organisation(s) de la personne sélectionnée dans la liste ci-dessus.

Je me suis pris la tête avec Ajax avant de découvrir qu'il fallait utiliser une instruction propre à Wordpress :

Code php :

Sélectionner tout - Visualiser dans une fenêtre à part

add_action('wp_ajax_do_ajax', 'notre_fonction_ajax');

Par contre, je ne parviens toujours pas à faire passer ma variable (valeur de nomPersonne) pour pouvoir faire ma reqête pour le champ suivant.

J'ai donc un fichier JS :

Code javascript :

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
jQuery(document).ready(function(){
     jQuery('#nomPersonne').mouseleave(function(){
          doAjaxRequest();
     });
});
function doAjaxRequest(){
 
     jQuery.ajax({
          url: 'wp-admin/admin-ajax.php',
          data:{
               'action':'do_ajax',
               'fn':'get_id_value'
               },
          dataType: 'JSON',
          success:function(data){
                    jQuery("#nomOrgani").html(data);
                             },
          error: function(errorThrown){
               alert('error');
               console.log(errorThrown);
          }
 
     });
 
}

Ma fonction dans function.php :

Code php :

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 notre_fonction_ajax(){
 
   // ce switch lancera les fonctions selon la valeur qu'aura notre variable 'fn'
 
     switch($_REQUEST['fn']){
          case 'get_id_value':
               $output = ajax_get_id_value($_REQUEST['count']);
          break;
          default:
              $output = 'No function specified, check your jQuery.ajax() call';
          break;
 
     }
 
   // Maintenant nous allons transformer notre résultat en JSON et l'afficher
 
     $output=json_encode($output);
     if(is_array($output)){
        print_r($output);
     }
     else{
        echo $output;
     }
     die;
 
}
 
function ajax_get_id_value(){
function ajax_get_id_value(){
 
include_once 'connexion.php';
 
$term = $_GET['term']; 
 
$requete = $link->prepare("SELECT `wp_postmeta`.`meta_value`  FROM `wp_postmeta` 
JOIN `wp_term_relationships` ON `wp_postmeta`.`post_id` = `wp_term_relationships`.`object_id` 
JOIN `wp_term_taxonomy` ON `wp_term_relationships`.`term_taxonomy_id` = `wp_term_taxonomy`.`term_taxonomy_id`
JOIN `wp_terms` ON `wp_terms`.`term_id` = `wp_term_taxonomy`.`term_id`
WHERE `wp_terms`.`name` = 'Malaysia Airlines' AND `wp_postmeta`.`meta_key`='organization' AND `wp_postmeta`.`meta_value` LIKE :term ");
 
$requete->execute(array('term' => '%' . $term . '%'));
 
$array = array(); // on créé le tableau
 
while ($donnee = $requete->fetch()) { // on effectue une boucle pour obtenir les données
    array_push($array, $donnee['meta_value']); // et on ajoute celles-ci à notre tableau
}
 
echo json_encode($array); // il n'y a plus qu'à convertir en JSON
}
}

Dans ce dernier fichier, j'ai "mis en du "Malaysia Airlines" mais c'est en fait cette variable que je devrais récupérer.

Quand je regarde dans Firebug, je vois bien la réponse : ["Malaysia Airlines"] sur la console mais je ne parviens pas à récupérer cette valeur pour l'utiliser dans ma requête ensuite

Bref, je viens de finir ma formation, je suis en stage et j'ai un peu de mal à mettre faire travailler ensemble tous les langages, CMS, etc...

Bref j'ai la cervelle en compote... Si quelqu'un a quelques lumières, je vous en serai éternellement reconnaissante !

Kaelig.

[kaelig]

Je vais m'y remettre ce week end, si vous avez des suggestions...

[NoSmoking]

Bonjour,

Par contre, je ne parviens toujours pas à faire passer ma variable (valeur de nomPersonne)

pas tout bien suivi/compris, mais on ne trouve pas dans ton code l'envoi du paramètre nom_personne

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
  url: 'wp-admin/admin-ajax.php',
      data:{
           'action':'do_ajax',
           'fn':'get_id_value',
           'param' : $('#id_du_champ').val()   // par exemple
         },

[kaelig]

Bonjour,

Merci pour la réponse, en fait je pensais récupérer cette donnée dans la fonction :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

'fn':'get_id_value'

avec quelque chose comme çà :

Code php :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
function ajax_get_id_value(){
    $nom = $_GET['nomPersonne'];
    echo $nom;
}

Mais je dois me tromper quelque part dans la logique, je pense que je vais tout reprendre à zero.

J'ai en fait deux listes (nom personne et non organisation), qui se remplissent par autocomplete si des données existent dans la BDD, cette partie là marche.
Ensuite je voudrais récupérer les deux champs sélectionnés pour faire une requête afin d'afficher les données correspondantes en BDD si elles existent, sinon on continue de remplir le formulaire et on l'envoie les données en BDD.
Je voulais aussi améliorer en remplissant le deuxième champ en fonction de ce qui est saisi dans le premier.
Mais à force d'avoir le nez dessus, je ne vois plus rien...
Comment procéderiez vous au plus simple et efficace ?
Bonne journée.

[kaelig]

J'ai un peu avancé...
J'ai dans mon fichier JS des fonctions pour récupérer les inputs de nomPersonne et nomOrgani et les fonctions php correspondantes qui marchent:

POUR nomPersonne : Fichier JS

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
jQuery(document).ready(function(){
     jQuery('#nomPersonne').change(function(){
          doAjaxRequest1();
     });
});
function doAjaxRequest1(){
      jQuery.ajax({
          url: 'wp-admin/admin-ajax.php',
          data:{
               'action':'do_ajax',
               'fn':'get_pers_value', 
               'value': document.getElementById("nomPersonne").value
               },
          dataType: 'JSON',
          success:function(data){
                    //alert('çà marche !');
                             },
          error: function(errorThrown){
               alert('error');
               console.log(errorThrown);
          }
     });
 }

POUR nomOrganie : Fichier JS

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
jQuery(document).ready(function(){
     jQuery('#nomOrgani').change(function(){
          doAjaxRequest2();
     });
});
 
    function doAjaxRequest2(){
 
     jQuery.ajax({
          url: 'wp-admin/admin-ajax.php',
          data:{
               'action':'do_ajax',
               'fn':'get_org_value', 
               'value': document.getElementById("nomOrgani").value
               },
          dataType: 'JSON',
          success:function(data){
              //alert('çà marche !');      
              show('signalIntox');
                             },
          error: function(errorThrown){
               alert('error');
               console.log(errorThrown);
          }
 
     });
 
}

Et fichier PHP pour les deux :

Code php :

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
add_action('wp_ajax_nopriv_do_ajax', 'notre_fonction_ajax');
add_action('wp_ajax_do_ajax', 'notre_fonction_ajax');
function notre_fonction_ajax(){
   // ce switch lancera les fonctions selon la valeur qu'aura notre variable 'fn'
     switch($_REQUEST['fn']){
          case 'get_pers_value':
               $output = ajax_get_pers_value('value');
          break;
          case 'get_org_value':
               $output = ajax_get_org_value('value');
          break;
          default:
              $output = 'No function specified, check your jQuery.ajax() call';
          break;
     }
   // Maintenant nous allons transformer notre résultat en JSON et l'afficher
     $output=json_encode($output);
     if(is_array($output)){
        print_r($output);
     }
     else{
        echo $output;
     }
     die; 
}
function ajax_get_pers_value($nomPersonne){
    $nom = $_REQUEST['value'];
    return $nom;
}   
function ajax_get_org_value($nomOrgani){
    $org = $_REQUEST['value'];
    return $org;
}

"
Et donc tout çà marche puisque je récupère les valeur des 2 inputs dans firebug "GET admin-ajax.php?action... " j'ai bien dans l'onglet réponse la valeur qui s'affiche , par exemple "NOM DE LA PERSONNE" et pareil pour l'organisation.

Maintenant, avec ces valeurs la je voudrais faire des requêtes pour :
Pour la valeur nomPersonne, en déduire toutes les organisations à trouver en BDD
Pour la valeur nomOrgani + nomPersonne : faire la requete avec les deux noms pour afficher le contenu du ou des post ayant ses noms.
Il faudrait, je pense, que dans la partie success function(data), j'envoie vers une page php pour faire des mes requêtes... à suivre !

[NoSmoking]

...avec ces valeurs la je voudrais faire des requêtes...

pour cela il te faut aller regarder du coté du forum Base de Données.

[kaelig]

Oui, en effet, c'est un problème BDD maintenant, j'ai créé des fonctions en javascript pour stocker et lire des cookies.
J'ai donc pu créer et lire mes cookies dans la fonction success ci-dessous et je voudrais donc les récupérer pour les intégrer à ma requête SQL.
A suivre donc, je ne désespère pas...

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
function doAjaxRequest1(){
 
 jQuery.ajax({
      url: 'wp-admin/admin-ajax.php',
      data:{
           'action':'do_ajax',
           'fn':'get_pers_value', 
           'value': document.getElementById("nomPersonne").value
           },
      dataType: 'JSON',
      success:function(data){
                //alert('çà marche !');
                createCookie('nom',document.getElementById("nomPersonne").value,0);
                console.log(readCookie('nom'));
                alert(readCookie('nom')); 
                },
      error: function(errorThrown){
           alert('error');
           console.log(errorThrown);
      }
 
 });
 
 }

[kaelig]

Sinon, je n'arrive pas à faire çà, j'ai écrit javascript mais rien n'était coloré du coup...
Motif: Merci d'indiquer le langage utilisé ([code=xxx]) pour activer la coloration syntaxique !

[Bovino]

[NoSmoking]

je voudrais donc les récupérer pour les intégrer à ma requête SQL.

il te suffit donc après récupération de faire une nouvelle requête.

Au passage :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

'value': document.getElementById("nomPersonne").value

est à remplacer par

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

'value': $("#nomPersonne").val() // autant être jQuery jusqu'au bout !

[kaelig]

Oui, c'est vrai... je suis stagiaire, j'ai encore beaucoup à apprendre, merci pour votre aide

[NoSmoking]

...merci pour votre aide

alors résolu or not ????

[kaelig]

Bonjour,

Pas tout à fait résolu... en fait j'ai un décalage dans mes cookies, le deuxième arrive trop tard, si on peut dire... j'ai le nom de la première demande et l'organisme de la deuxième.
Par contre, si je remplis deux fois les champs de la même façons la bonne info s'affiche bien, donc la requête et l'affichage marche une fois que les deux bons cookies dont enregistrés.
Et de plus çà ne fonctionne que sur Firefox, sur Chrome et IE la deuxième liste d'autocomplete ne s'affiche pas et dans l'outil dev de chrome je retrouve bien le cookie 'org' mais pas le cookie 'nom'...
Je ne dois plus être très loin, je persiste !
Bonne journée.
Kaelig.

[NoSmoking]

Reprend bien la chronologie des actions en sachant que les fonctions requête Ajax sont asynchrones et que le résultat n'est pas immédiatement disponible.

Cela peut servir : Un classique AJAX : utiliser les données au bon moment !

[kaelig]

Bonjour,

Oui, c'est tout à fait çà !
J'ai du imbriquer deux appels Ajax en fait.
Au moment où je crée le deuxième cookie je lance un appel pour créer la div (requête puis affichage).
C'est un peu alambiqué mais en gros çà marche, çà ne me sort pas tous les affichages que je veux mais je pense que c'est un problème dans la requête elle même.
En tous cas la "machine Ajax" fonctionne !
Merci pour les conseils.
Bonne journée.
Kaelig.