web-dev-qa-db-fra.com

Comment trier une table de publications personnalisées par colonne contenant un champ personnalisé

J'ai un type de message personnalisé appelé laptop avec des champs personnalisés tels que CPU, OS, RAM etc. créé à l'aide du plugin Advanced Custom Fields.

J'affiche une table des ordinateurs portables, où l'en-tête de la table est une ligne de champs personnalisés, et chaque ligne suivante est un nom d'ordinateur portable et ses valeurs de champs personnalisés dans chacune des cellules de colonne correspondantes.

Je veux pouvoir trier la table en cliquant sur la cellule TH de la table contenant le nom du champ personnalisé.

Le support d’ACF nous a fait remarquer/ clauses de requête méta , mais je n’en suis pas à la hauteur.

J'apprécierais vraiment de l'aide pour générer des URL qui entourent le nom du champ personnalisé dans chaque élément TH.

3
Steve

Pour faire suite au commentaire de @ rock3t, devez-vous vraiment interroger le serveur chaque fois qu'un utilisateur clique sur un en-tête de colonne?

Avez-vous envisagé d'utiliser jQuery tablesorter ? Il permet à un utilisateur final de trier un tableau HTML en effectuant des manipulations DOM.

Je ne l'ai jamais utilisé dans un projet WP, mais je l'ai beaucoup utilisé dans d'autres projets que j'ai construits et cela fonctionne très bien. C'est very configurable, donc je suis sûr que cela répondra à vos besoins.

tablesorter est not un des plugins jQuery inclus avec WP Core. Vous devrez donc le télécharger (à partir du lien ci-dessus), l'inclure quelque part dans votre plugin/thème et le mettre en file d'attente. Ensuite, mettez en file d'attente un simple fichier JS qui voudrait quelque chose comme:

(function ($) {
    $(document).ready (function () {         
        $('#id_of_your_table').tablesorter ({widgets: ['zebra']}) ;     
        }) ;
})(jQuery) ;

Vous pouvez en savoir plus sur l'utilisation de tablesort dans leur docs , y compris divers autres paramètres de la méthode tablesorter().

Simple avec cette référence: https://codex.wordpress.org/Class_Reference/WP_Query

orderby devrait être meta_value

'meta_value' - Notez qu'un 'meta_key = keyname' doit également être présent dans la requête.

Le nom de votre clé doit être l’un des éléments suivants: CPU, OS, RAM ...

Aussi, vous pouvez considérer la classe WP_Meta_Query. https://codex.wordpress.org/Class_Reference/WP_Meta_Query


La mise à jour


J'ai eu ce résultat

    Array
(
    [0] => WP_Post Object
        (
            [ID] => 3233
            [post_author] => 1
            [post_date] => 2016-11-19 12:51:43
            [post_date_gmt] => 2016-11-19 12:51:43
            [post_content] => abc
            [post_title] => Mac Air Pro 9G
            [post_excerpt] => 
            [post_status] => publish
            [comment_status] => closed
            [ping_status] => closed
            [post_password] => 
            [post_name] => mac-air-pro-3
            [to_ping] => 
            [pinged] => 
            [post_modified] => 2016-11-19 12:52:19
            [post_modified_gmt] => 2016-11-19 12:52:19
            [post_content_filtered] => 
            [post_parent] => 0
            [guid] => http://steve.com/laptop/mac-air-pro-1-copy/
            [menu_order] => 0
            [post_type] => laptop
            [post_mime_type] => 
            [comment_count] => 0
            [filter] => raw
        )

    [1] => WP_Post Object
        (
            [ID] => 3232
            [post_author] => 1
            [post_date] => 2016-11-19 12:46:50
            [post_date_gmt] => 2016-11-19 12:46:50
            [post_content] => abc
            [post_title] => Mac Air Pro 8G
            [post_excerpt] => 
            [post_status] => publish
            [comment_status] => closed
            [ping_status] => closed
            [post_password] => 
            [post_name] => mac-air-pro-2
            [to_ping] => 
            [pinged] => 
            [post_modified] => 2016-11-19 12:52:47
            [post_modified_gmt] => 2016-11-19 12:52:47
            [post_content_filtered] => 
            [post_parent] => 0
            [guid] => http://steve.com/laptop/mac-air-pro-1-copy/
            [menu_order] => 0
            [post_type] => laptop
            [post_mime_type] => 
            [comment_count] => 0
            [filter] => raw
        )

    [2] => WP_Post Object
        (
            [ID] => 3231
            [post_author] => 1
            [post_date] => 2016-11-19 12:12:38
            [post_date_gmt] => 2016-11-19 12:12:38
            [post_content] => abc
            [post_title] => Mac Air Pro 4G
            [post_excerpt] => 
            [post_status] => publish
            [comment_status] => closed
            [ping_status] => closed
            [post_password] => 
            [post_name] => mac-air-pro-1
            [to_ping] => 
            [pinged] => 
            [post_modified] => 2016-11-19 12:52:57
            [post_modified_gmt] => 2016-11-19 12:52:57
            [post_content_filtered] => 
            [post_parent] => 0
            [guid] => http://steve.com/?post_type=laptop&p=3231
            [menu_order] => 0
            [post_type] => laptop
            [post_mime_type] => 
            [comment_count] => 0
            [filter] => raw
        )

)

Voici le contenu du fichier single-laptop.php:

<?php
/**
 * The template for displaying all single posts.
 *
 * @link https://developer.wordpress.org/themes/basics/template-hierarchy/#single-post
 *
 * @package microformats
 */

get_header(); 


// WP_Query arguments
$args = array (
    'post_type'              => array( 'laptop' ),
    'post_status'            => array( 'published' ),
     //'s'                      => 'atom', // only if you need that
    'nopaging'               => true,
    'posts_per_page'         => '-1',
    'ignore_sticky_posts'    => true,
    // order
    'orderby'                => 'meta_value', 
    'meta_key'               => 'ram',
    'order'                  =>'DESC',
    /* you will need this only if
    'meta_query'             => array(
        array(
            'key'       => 'ram', // or os, or cpu
            'value'     => '4', // meaning 4G of ram
            'compare'   => '>',  // meaning only biggar
            'type'      => 'NUMERIC',
        ),
    ),
    */
);


// The Query
$query = new WP_Query( $args );
print_r($query->posts);


?>

    <div id="primary" class="content-area">
        <main id="main" class="site-main" role="main">

        <?php while ( have_posts() ) : the_post(); ?>

            <?php get_template_part( 'template-parts/content', 'single' ); ?>

            <?php
                // If comments are open or we have at least one comment, load up the comment template.
                if ( comments_open() || get_comments_number() ) :
                    comments_template();
                endif;
            ?>


            <hr class="fat" />              

        <?php endwhile; // End of the loop. ?>

        </main><!-- #main -->
    </div><!-- #primary -->

<?php get_sidebar(); ?>
<?php get_footer(); ?>
0
prosti