it-swarm.com.ru

Нажмите загружает шаблон через ajax

Я пытаюсь загрузить шаблон через ajax, если пользователь нажимает кнопку. Это код, который я использую:

На functions.php:

function phantom_scripts() {
  global $child_dir;

  /* Ajax Requests */
  wp_enqueue_script( 'ajax-stuff', get_stylesheet_directory_uri() . '/js/ajax.js', array( 'jquery' ), true );
 }
 add_action( 'wp_enqueue_scripts', 'phantom_scripts' );


function portfolio_ajax() {
  include( 'templates/cards.php' );
  die();
}
add_action('wp_ajax_nopriv_portfolio_ajax', 'portfolio_ajax');
add_action('wp_ajax_portfolio_ajax', 'portfolio_ajax');

wp_localize_script( 'ajax-stuff', 'ajaxStuff', array( 'ajaxurl' => admin_url( 'admin-ajax.php' ) ) );

На ajax.js:

(function($) {
    $('#load-cards').click(function() {
        alert();
            $.ajax({
                url: ajaxurl,
                data: {
                    action: 'portfolio_ajax'
                },
                success: function(data) {
                    $('#cards-container').append(data);
                },

                error: function(MLHttpRequest, textStatus, errorThrown){
                    alert(errorThrown);
                }
            });
        });
})(jQuery);

HTML:

<a href="javascript:void(0)" id="load-cards">Load cards</a>

В данный момент консоль не показывает мне никаких ошибок, но не загружает содержимое, которое есть в файле templates/cards.php. Есть идеи, что мне не хватает?

2
wpuser

Итак, вы используете wp_localize_script для вставки URL-адреса ajax. Но вы не использовали локализованный дескриптор var для доступа к этому значению. Попробуй это:

/* ... */
$.ajax({
    url: ajaxStuff.ajaxurl, // NOTE use of 'ajaxStuff' object
/* ... */
1
Dougal Campbell

Сначала вам нужно сделать то, что сказал Дугал относительно правильного указанияajax-url. Я бы также указалdataType. dataType - это тип данных, которые вы ожидаете от сервера, вы можете узнать больше об этом здесь.

И я бы использовал WordPress get_template_part , чтобы получить шаблон.

0
Lasse M. Tvedt