WordPress : WordPress (thème TwentyTen) : Obtenez des résultats de recherche sans ouvrir de nouvelle page

Publié par Jean-Michel le

Je travaille sur un site WordPress.

Je souhaite charger les résultats de la recherche dans la page actuellement ouverte à l’aide des méthodes AJAX. Pour pouvoir faire cela, j’ai besoin d’obtenir la sortie du code PHP qui effectue la recherche, sans ouvrir la nouvelle page.

Normalement, après avoir tapé un mot de recherche, WordPress ouvre la nouvelle page avec une URL comme celle-ci :

mondomaine.com/?s=searchword

La sortie du code PHP qui effectue la recherche est affichée dans la div #container de cette page.

Question : comment puis-je obtenir les résultats de la recherche sans ouvrir la nouvelle page, afin de pouvoir les charger à l’aide de jQuery dans la page actuellement ouverte ?

Je serais reconnaissant de vos conseils!

Solution n°1 trouvée

Ce plugin le fait pour vous à peu près. Vous voudrez peut-être regarder le code source du plugin et voir comment vous pouvez l’exploiter par vous-même.

http://wordpress.org/extend/plugins/threewp-ajax-search/screenshots/

Je suppose que vous pouvez également appeler la page de recherche vous-même, analyser la valeur #container, puis analyser vous-même la liste des résultats. Si vous voulez de l’aide, faites-le moi savoir. Sinon je pense qu’un plugin déjà développé est assez pratique.

Comme demandé, voici quelques réflexions supplémentaires sur la façon dont je pense pouvoir le faire. Rien de tout cela n’est testeur, mais j’ai les idées générales sont bonnes. Vous devrez modifier les choses en fonction de votre installation. Par exemple Get vs Post. Temps libre. Demander des données.

  1. Utilisez l’appel ajax de jQuery pour demander la page de recherche.

    $.ajax({
                    async: true,
                    data: $dataToSend,
                    datatype: 'xml',
                    beforeSend: function() {
                        console.log('rq');
                    },
                    error: function(jqXHR, textStatus, errorThrown) {
                        console.log('error');
                    },
                    success: function(xml, textstatus, jqXHR) {
                        //Process Response Data
                    },          
                    timeout: 10000,
                    type: 'POST',
                    url: 'http://' + document.location.host + '/search'     
            });
    
  2. Traitez la réponse et éliminez les données qui vous intéressent. http://www.switchonthecode.com/tutorials/xml-parsing-with-jquery

    $(xml).find(‘div[class= »post »]’).each( function() { $(« #currentPage »).append($(this) +  »
    « ); });

SO refuse de bloquer le code de ce bit de liste. Désolé pour ça.

Catégories : Wordpress

Jean-Michel

Jean-Michel est en charge de la partie blog du site. Il met en place la stratégie de contenu et répond aux questions fréquentes sur Wordpress.

0 commentaire

Laisser un commentaire

Avatar placeholder

Votre adresse e-mail ne sera pas publiée. Les champs obligatoires sont indiqués avec *