Ricerca AJAX nelle pagine di post per tipi di post personalizzati

Question

Ricerca AJAX nelle pagine di post per tipi di post personalizzati

22 ago 2012, 22:58:43

Visualizzazioni: 14.9K

Voti: 8

Sto avendo problemi nel creare una ricerca AJAX nelle mie pagine singole di post. Ho bisogno di limitare i risultati della ricerca ai tipi di post personalizzati "fod_videos" e "post" e alla categoria 12. Il problema è che la ricerca restituisce tutti i post sotto questi filtri senza considerare il valore di ricerca. Probabilmente mi sfugge qualcosa di ovvio ma non riesco a capire cosa. Ecco il mio setup.

<div class="panel">
  <h2>Cerca Video</h2>
  <div id="my-search">
   <form role="search" method="get" id="searchform" action="http://myurl.com/" >
    <input type="text" value="" name="s" id="s" />
    <input type="submit" id="searchsubmit" value="Cerca" />
   </form>
  </div>
</div>

add_action('wp_ajax_wpa5000_search', 'wpa5000_search');
add_action('wp_ajax_nopriv_wpa5000_search', 'wpa5000_search');
function wpa5000_search(){
  global $wp_query;
  $search = $_POST['search_val'];
  $args = array(
    's' => $search,
    'posts_per_page' => 10,
    'cat' => 12, 
    'post_type' => array( 'post','fod_videos'  )
  );
  $wp_query = new WP_Query( $args );

  get_template_part( 'video-search-results' );

  exit;
}

add_action( 'wp_enqueue_scripts', 'wpa56343_scripts', 100 );
function wpa56343_scripts() {
 wp_enqueue_script(
    'wpa56343_script',
    get_template_directory_uri() . '/libs/search.js?ver=1.0',
    array( 'jquery' ),
    null,
    false
 );
 wp_localize_script(
    'wpa56343_script',
    'WPaAjax',
    array(
        'ajaxurl' => admin_url( 'admin-ajax.php' )
    )
 );
}

// search.php

$(document).ready(function($){
 $('#searchsubmit').click(function(e){
    var $panel = $(this).closest(".panel");
    $panel.empty();
    e.preventDefault();
    var search_val=$("#s").val();
    $.post(
        WPaAjax.ajaxurl,
        {
            action : 'wpa5000_search',
            search_val : search_val
        },
        function( response ) {
            $panel.append( response );
        }
    );
 });
});

//video-search-results.php

<?php
 while ( $wp_query->have_posts() ) : $wp_query->the_post(); ?>
   //CONTENUTO
<?php endwhile; ?>

Pollux Khafra

888

tipi di post personalizzati wp query ricerca ajax

Commenti

$wp_query è effettivamente un oggetto WP_Query?

Brian Fegter

23 ago 2012 05:54:29

@BrianFegter Non sono sicuro di aver capito cosa intendi. È strano perché uso questa stessa formula nella mia pagina index per ottenere risultati di ricerca AJAX e funziona bene. Semplicemente non sta recuperando il search_val. Ho provato a stampare $search ma non restituisce nulla.

Pollux Khafra

23 ago 2012 06:25:49

Le azioni AJAX non hanno $wp_query definito perché non c'è un contesto oltre ai dati $_POST.

Brian Fegter

23 ago 2012 06:32:07

Cosa lo fa funzionare dalla mia pagina indice? Lo uso per sostituire il loop predefinito con i risultati della ricerca e funziona.

Pollux Khafra

23 ago 2012 06:42:20

Tutte le risposte alla domanda

Ho fatto funzionare il codice originale, ma con il custom post type (senza le categorie). Aggiungi un input nascosto nel tuo form con il tuo post type in questo modo:

<input type="hidden" name="post_type" value="fod_videos" />

user142428

31

25 apr 2018 04:09:37

fuxia 107K · Accepted Answer · 2012-08-25T02:49:44Z

Invece di 'cat' => 12 e $wp_query usa 'category_name' => slug e get_posts().

Ecco un esempio base di come funziona:

PHP

add_action( 'wp_loaded', array ( 'T5_Ajax_Search', 'init' ) );

/**
 * Rendere la ricerca in Ajax.
 */
class T5_Ajax_Search
{
    /**
     * L'istanza principale. Puoi creare ulteriori istanze per i test.
     * @type object
     */
    protected static $instance = NULL;

    /**
     * Nome dell'azione usata dai gestori di callback AJAX
     * @type string
     */
    protected $action = 't5_ajax_search';

    /**
     * Gestore per il caricamento iniziale.
     *
     * @wp-hook wp_loaded
     * @return void
     */
    public static function init()
    {
        NULL === self::$instance and self::$instance = new self;
        return self::$instance;
    }

    /**
     * Costruttore. Registra le azioni.
     *
     *  @wp-hook wp_loaded
     *  @return object
     */
    public function __construct()
    {
        $callback = array ( $this, 'search' );
        add_action( 'wp_ajax_'        . $this->action,        $callback );
        add_action( 'wp_ajax_nopriv_' . $this->action, $callback );
        add_action( 'wp_enqueue_scripts', array ( $this, 'register_script' ) );
    }

    /**
     * Callback per la ricerca AJAX.
     *
     * @wp-hook wp_ajax_t5_ajax_search
     * @wp-hook wp_ajax_nopriv_t5_ajax_search
     * @return void
     */
    public function search()
    {
        $args  = array ( 's' => $_POST['search_term'] );
        $args  = apply_filters( 't5_ajax_search_args', $args );
        $posts = get_posts( $args );
        if ( $posts )
        {
            $this->render_search_results( $posts );
        }
        else
        {
            print '<b>nessun risultato trovato</b>';
        }
        exit;
    }

    /**
     * Crea il markup dai $posts
     *
     * @param array $posts Array di oggetti post
     * @return void
     */
    protected function render_search_results( $posts )
    {
        print '<ul class="t5-ajax-search-results">';

        foreach ( $posts as $post )
        {
            printf(
                '<li><a href="%1$s">%2$s</a></li>',
                get_permalink( $post->ID ),
                esc_html( $post->post_title )
            );
        }
        print '</ul>';
    }

    /**
     * Registra lo script e le variabili locali.
     *
     * @wp-hook wp_enqueue_scripts
     * @return void
     */
    public function register_script()
    {
        wp_enqueue_script(
            't5-ajax',
            #plugins_url( __FILE__ ) . '/search.js',
            plugins_url( 'search.js', __FILE__ ),
            array ( 'jquery' ),
            NULL,
            TRUE
        );

        wp_localize_script(
            't5-ajax',
            'T5Ajax',
            array(
                'ajaxurl' => admin_url( 'admin-ajax.php' ),
                'action'  => $this->action
            )
        );
    }
}

JavaScript `search.js`

jQuery( function( $ ) {
    // campo di ricerca
    var $s = $( '#s' );
    // il modulo di ricerca
    var $sForm = $s.closest( 'form' );
    console.log( $sForm );
    $sForm.on( 'submit', function( event) {
        event.preventDefault();
        $.post(
            T5Ajax.ajaxurl,
            {
                action:     T5Ajax.action,
                search_term: $s.val()
            },
            function( response ) {
                // aggiungi semplicemente il risultato al modulo di ricerca.
                $sForm.append( response );
            }
        );
    });
});

Limitare la ricerca

add_filter( 't5_ajax_search_args', 'restrict_t5_search' );

function restrict_t5_search( $args )
{
    $args['post_type'] = array ( 'post', 'fod_videos' );
    $args['category_name']       = 'category-slug';
    return $args;
}

Invece del mio $this->render_search_results( $posts ); puoi anche caricare un template dal tuo tema e usare l'array $posts in un risultato più sofisticato. :)

Ricerca AJAX nelle pagine di post per tipi di post personalizzati

PHP

JavaScript search.js

Limitare la ricerca

JavaScript `search.js`