Maison >développement back-end >tutoriel php >Comment filtrer plusieurs publications dans WordPress par balise en utilisant AJAX, sans utiliser de plugin

Comment filtrer plusieurs publications dans WordPress par balise en utilisant AJAX, sans utiliser de plugin

Patricia Arquette
Patricia Arquetteoriginal
2024-12-06 11:10:17380parcourir

How to Filter multiple Posts in WordPress by tag Using AJAX, without using any plugin

Étape 1 :
Case à cocher HTML comme ceci :

<div>



<p>display all tabs or subjects container:<br>
</p>

<pre class="brush:php;toolbar:false"><!-- Container to display worksheets -->
<div>



<p><strong>Step-2:</strong><br>
create js file:<br>
</p>

<pre class="brush:php;toolbar:false">jQuery(document).ready(function ($) {
    // Fetch Subjects on any checkbox change
    $('.subject-filter').on('change', function () {
        // Gather all selected grades
        var taxonomy = $(this).data('taxonomy'); // Taxonomy name
        var terms = []; // Array to hold selected terms
        $('.subject-filter:checked').each(function () {
            terms.push($(this).val());
        });

        // Fetch Subjects for selected grades
        fetchSubjects(taxonomy, terms);
    });

    // Function to fetch Subjects
    function fetchSubjects(taxonomy = '', terms = []) {
        $.ajax({
            url: ajax_object.ajax_url,
            type: 'POST',
            data: {
                action: 'fetch_subjects',
                nonce: ajax_object.nonce,
                taxonomy: taxonomy,
                terms: terms, // Send array of selected terms
            },
            beforeSend: function () {
                $('.worksheet-container').html('<p>Loading...</p>');
            },
            success: function (response) {
                if (response.success) {
                    $('.worksheet-container').html(response.data.html);
                } else {
                    $('.worksheet-container').html('<p>' + response.data.message + '</p>');
                }
            },
            error: function () {
                $('.worksheet-container').html('<p>An error occurred. Please try again.</p>');
            },
        });
    }
});

Étape 3 :
Créer des fonctions dans function.php :

// Enregistrez l'action AJAX pour les utilisateurs connectés (vous pouvez également en ajouter pour les utilisateurs non connectés)
add_action('wp_ajax_fetch_subjects', 'fetch_subjects');
add_action('wp_ajax_nopriv_fetch_subjects', 'fetch_subjects');
fonction fetch_subjects() {
    // Vérifier nonce pour la sécurité
    if (!isset($_POST['nonce']) || !wp_verify_nonce($_POST['nonce'], 'ajax_nonce')) {
        wp_send_json_error(array('message' => 'La vérification ponctuelle a échoué.'));
        wp_die();
    }

    // Récupère la taxonomie et les termes de la requête AJAX
    $taxonomie = isset($_POST['taxonomie']) ? sanitize_text_field($_POST['taxonomie']) : '';
    $terms = isset($_POST['terms']) ? array_map('sanitize_text_field', $_POST['terms']) : array();

    // Arguments de requête par défaut
    $args = tableau(
        'post_type' => 'feuille de travail',
        'posts_per_page' => -1, // Récupère tous les messages
    );

    // Si les termes sont sélectionnés, modifiez la requête
    if (!empty($taxonomy) && !empty($terms)) {
        $args['tax_query'] = tableau(
            tableau(
                'taxonomie' => $taxonomie,
                'champ' => 'limace',
                'termes' => $terms, // Passe le tableau des termes sélectionnés
                'opérateur' => 'IN', // Correspond à l'un des termes sélectionnés
            ),
        );
    }

    // Exécutez WP_Query pour récupérer les publications
    $query = nouveau WP_Query($args);

    // Vérifiez si des messages ont été trouvés
    if ($query->have_posts()) {
        $html = '';
        while ($query->have_posts()) {
            $query->the_post();
            // Sortie du message HTML
            $html .= '<div>




          

            
        

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!

Déclaration:
Le contenu de cet article est volontairement contribué par les internautes et les droits d'auteur appartiennent à l'auteur original. Ce site n'assume aucune responsabilité légale correspondante. Si vous trouvez un contenu suspecté de plagiat ou de contrefaçon, veuillez contacter admin@php.cn