Căutare AJAX pe paginile de postări după tip personalizat

Question

Căutare AJAX pe paginile de postări după tip personalizat

22 aug. 2012, 22:58:43

Vizualizări: 14.9K

Voturi: 8

Am o problemă în crearea unei căutări AJAX pe paginile mele de postări individuale. Trebuie să limitez rezultatele căutării la tipurile de postări personalizate "fod_videos" și "post" și la categoria 12. Problema este că căutarea returnează toate postările sub acești filtri și nu ține cont de valoarea căutată. Cred că îmi scapă ceva evident dar nu reușesc să-mi dau seama. Iată configurația mea.

<div class="panel">
  <h2>Căutare Videoclipuri</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="Căutare" />
   </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(); ?>
   //CONȚINUT
<?php endwhile; ?>

Pollux Khafra

888

tipuri de postare personalizate wp query căutare ajax

Comentarii

Este $wp_query un obiect WP_Query real?

Brian Fegter

23 aug. 2012 05:54:29

@BrianFegter Nu sunt sigur că înțeleg ce vrei să spui. E ciudat, folosesc aceeași formulă pe pagina mea de index pentru a obține rezultatele de căutare AJAX și funcționează bine. Doar că nu preia valoarea search_val. Am încercat să afișez $search, dar nu returnează nimic.

Pollux Khafra

23 aug. 2012 06:25:49

Acțiunile AJAX nu au $wp_query definit pentru că nu există alt context decât datele $_POST.

Brian Fegter

23 aug. 2012 06:32:07

Ce face ca acest lucru să funcționeze din pagina mea de index? Îl folosesc pentru a înlocui bucla implicită cu rezultatele căutării și funcționează.

Pollux Khafra

23 aug. 2012 06:42:20

Toate răspunsurile la întrebare

Am reușit să fac codul original să funcționeze, dar cu tipul de postare personalizat (fără categorii). Adaugă un input ascuns în formularul tău cu tipul tău de postare, astfel:

<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

În loc de 'cat' => 12 și $wp_query folosește 'category_name' => slug și get_posts().

Iată un exemplu de bază despre cum funcționează:

PHP

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

/**
 * Face căutarea să funcționeze prin AJAX.
 */
class T5_Ajax_Search
{
    /**
     * Instanța principală. Poți crea instanțe suplimentare pentru teste unitare.
     * @type object
     */
    protected static $instance = NULL;

    /**
     * Numele acțiunii folosit de handler-ele de callback AJAX
     * @type string
     */
    protected $action = 't5_ajax_search';

    /**
     * Handler pentru încărcarea inițială.
     *
     * @wp-hook wp_loaded
     * @return void
     */
    public static function init()
    {
        NULL === self::$instance and self::$instance = new self;
        return self::$instance;
    }

    /**
     * Constructor. Înregistrează acțiunile.
     *
     *  @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 pentru căutarea 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>nimic găsit</b>';
        }
        exit;
    }

    /**
     * Creează markup din $posts
     *
     * @param array $posts Array de obiecte 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>';
    }

    /**
     * Înregistrează scriptul și variabilele locale.
     *
     * @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( $ ) {
    // câmpul de căutare
    var $s = $( '#s' );
    // formularul de căutare
    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 ) {
                // doar adaugă rezultatul la formularul de căutare.
                $sForm.append( response );
            }
        );
    });
});

Restricționarea căutării

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;
}

În loc de $this->render_search_results( $posts ); poți încărca un template din tema ta și folosi array-ul $posts într-un rezultat mai sofisticat. :)

Căutare AJAX pe paginile de postări după tip personalizat

PHP

JavaScript search.js

Restricționarea căutării

JavaScript `search.js`