Variable an WordPress-Funktion übergeben und aktualisieren mit Ajax

Question

Ich baue eine Shopping-Seite, die alle Geschäfte auflisten. Ich habe eine Seitenleiste mit allen Kategorien und eine Liste mit Paginierung erstellt. Diese Liste wird durch eine Wordpress-Funktion in meinem theme-functions.php erzeugt, aber wenn ich in irgendeine Kategorie klicke, werde ich zu einer anderen Seite umgeleitet (zu http://<domain>/store von http://<domain>/category). Also habe ich eine JavaScript-Funktion erstellt, um die Link-Aktion mit preventDefault zu verhindern und seinen href-Wert zu erhalten und als Variable festzulegen, um sie über Ajax an die Funktion zu übergeben.

Meine Frage ist: gibt es eine Möglichkeit, diese Variable übergeben und aktualisieren Sie die Wordpress-Funktion auf der gleichen Seite, um diese Liste anzuzeigen?

-Code unten:

Wordpress Theme-function.php

function storeSingle() { 

    $catUrl = $_POST['catUrl']; 

    $paged = (get_query_var('paged')) ? get_query_var('paged') : 1; 

    $args = array(
     'post_type'    => 'lojas' , 
     'posts_per_page'  => 5, 
     'orderby'    => 'title', 
     'order'     => 'ASC', 
     'paged'     => $paged, 
     'category_name' => $catUrl 
); 

    /* Added $paged variable */ 

    $exec = new WP_Query($args); 

    if($exec->have_posts()): 
     echo '<ul class="single-store">'; 
     while($exec->have_posts()): 
      $exec->the_post(); 
      $categories = get_the_category($post->ID); 
       echo "<li class='store-box'>"; 
        echo '<a href=" '. get_the_permalink() .' ">'; 
         echo '<h1>'; 
          echo the_title(); 
         echo '</h1>'; 
        echo "</a>"; 

        echo '<div class="store-info-box">'; 
         echo '<span>'; 
          echo '<i class="fa fa-map-marker" aria-hidden="true"></i>'; 
          echo the_field('localizacao'); 
         echo '</span>'; 
         echo '<span>'; 
          echo $categories[0]->name; 
         echo '</span>'; 
        echo '</div>'; 

       echo "</li>"; 
     endwhile; 
     echo '</ul>'; 
     if (function_exists(custom_pagination)) { 
      custom_pagination($exec->max_num_pages,"",$paged); 
     } 
    endif; 

} 
add_action('wp_ajax_catUrl', 'catUrl'); 
add_action('wp_ajax_nopriv_catUrl', 'catUrl'); 

JavaScript-Funktion

$('.cat-item').on('click', 'a', function(e){ 
    e.preventDefault(); 
    var catUrl = this.href; 
    catUrl = catUrl.split('/'); 

    $.ajax({ 
     type: "POST", 
     url: 'http://localhost/asv/shopping/wp-admin/admin-ajax.php', 
     dataType: 'json', 
     data: { 
       action: catUrl, 
       catUrl: catUrl[5] 
     }, 
     success: function(data){ 
       response(data), 
       console.log('test' + data); 
     } 
    }); 
}); 

Ich habe das viel gesucht, aber ich habe nicht herausfinden, wie Ajax in WordPress richtig zu verwenden.

Answer 1

Wenn Sie Ergebnisse in Sie bekommen console.log('test' + data); scheint, müssen Sie nur diese Ergebnisse in Ihrem HTML-Container anzeigen, indem Sie den aktuellen Inhalt durch Ihre Ajax-Antwort ersetzen.