@Alexa_KyKi

Почему не работает Ajax подгрузка постов WordPress?

Всем привет. У меня такой дизайна сайта:
5f762e4d6b9e9245515006.jpeg
На каждом табе South Florida и т.д. свои посты, у каждого таба есть своя кнопка "Показать еще". Сейчас посты выводятся, кнопка отображется, но на первом табе если ее нажать, то она как-будто отрабатывает, но пост не показывает, а на следующих табах кнопка есть, но уже не нажимается, так как как-будто скрипт уже отработал. Как это исправить?

Вот код функции в файле страницы:
<div class="shooters-gallery gallery">
					<?php foreach( $categories as $key => $category) : ?>

					<?php $args = array(
						'posts_per_page' => 1,
						'post_type' => 'shooter',
						'tax_query' => array(
								array(
									'taxonomy'  => 'category',
									'field'     => 'term_id',
									'terms'     => $category -> term_id,
								)
							)
					);

					$query = new WP_Query( $args );

					// Цикл
					if ( $query->have_posts() ) : ?>
						<div class="tabs-content">
							<div class="row ">
								<?php while ( $query->have_posts() ) : $query->the_post(); ?>
									<div class="col-12 col-sm-4 col-lg-3 shooters-gallery__item">
										<div class="shooter-card">
											<div class="shooter-card__photo irof mb-3 ">
												<?php the_post_thumbnail(); ?>
											</div>
											<p class="text-h2 mb-3  shooter-card__title"><?php the_title(); ?></p>
											<p class=" text-7 mb-2 ">
												<?php $skills = get_field('shooters_skills');
												if( $skills ): ?>
													<?php foreach( $skills as $key => $skill ): ?>
														<?php if($skill == end($skills)) {
															echo $skill['label'];
														} else {
															echo $skill['label'] . ' / ';
														} ?>
													<?php endforeach; ?>
												<?php endif; ?>
											</p>
											<div class="shooter-card__contact shooter-card-contact">
												<div class="shooter-card-contact__row">
													<span class="shooter-card__label">Phone</span> <a class="shooter-card__data"
													href="tel:+1<?php the_field('shooters_phone'); ?>"><?php the_field('shooters_phone'); ?></a>
												</div>
												<div class="shooter-card-contact__row">
													<span class="shooter-card__label">Email</span> <a class="shooter-card__data"
													href="mailto:<?php the_field('shooters_email'); ?>"><?php the_field('shooters_email'); ?></a>
												</div>
											</div>
											<a class="shooter-card__link" href="<?php the_field('shooters_portfolio'); ?>" target="_blank"><?php the_field('shooters_portfolio'); ?></a>
										</div>
									</div>
									<!-- /.col-12  -->
								<?php endwhile; ?>
								<?php if (  $query->max_num_pages > 1 ) : ?>
									<script>
										var ajaxurl = '<?php echo site_url() ?>/wp-admin/admin-ajax.php';
										var true_posts = '<?php echo serialize($query->query_vars); ?>';
										var current_page = <?php echo (get_query_var('paged')) ? get_query_var('paged') : 1; ?>;
										var max_pages = '<?php echo $query->max_num_pages; ?>';
									</script>
									<button type="button" id="true_loadmore" class="button mb-30">Show more</button>
								<?php endif; ?>
							</div>
							<!-- /.row -->
						</div>
					<?php endif; ?>
					<?php wp_reset_query(); ?>
					<?php endforeach; ?>
				</div>


Код js файла:
jQuery(function ($) {
	$('#true_loadmore').click(function () {
		$(this).text('Loading...'); // изменяем текст кнопки, вы также можете добавить прелоадер
		var data = {
			'action': 'loadmoreposts',
			'query': true_posts,
			'page': current_page
		};

		$.ajax({
			url: ajaxurl, // обработчик
			data: data, // данные
			type: 'POST', // тип запроса
			success: function (data) {
				console.log(data);
				if (data) {
					$('#true_loadmore').text('Show more').before(data); // вставляем новые посты
					current_page++; // увеличиваем номер страницы на единицу
					if (current_page == max_pages) $("#true_loadmore").remove(); // если последняя страница, удаляем кнопку
				} else {
					$('#true_loadmore').remove(); // если мы дошли до последней страницы постов, скроем кнопку
				}
			}
		});
	});
});


И код в functions.php:
function main_load_posts(){
		$args = json_decode( stripslashes( $_POST['query'] ), true );
		$args['paged'] = $_POST['page'] + 1; // we need next page to be loaded
		$args['post_status'] = 'publish';
		$args['post_type'] = 'locations';
		$args['posts_per_page'] = 1; // по сколько записей подгружать
		$args['tax_query'] = array( array( 'taxonomy'  => 'category', 'field'     => 'term_id', 'terms'     => $category -> term_id));

		// обычно лучше использовать WP_Query, но не здесь
		query_posts( $args );
		// если посты есть
		if( have_posts() ) :
			echo '
				<div class="tabs-content">
					<div class="row ">
			';
						// запускаем цикл
						while( have_posts() ): the_post();

							echo '
								<div class="col-12">
									<div class="page-location-item">
										<div class="page-location-item__photo irof mb-3 mb-md-4">
											'. get_the_post_thumbnail() .'
										</div>
										<p class="text-h1 text-h1--36 mb-3 mb-md-4 page-location-item__title">'. get_the_title() .'</p>
										'. get_the_content() .'
									</div>
								</div>
							';

						endwhile;
			echo 	'</div>
					<!-- /.row -->
				</div>';
		endif;
		die();
	}


	add_action('wp_ajax_loadmoreposts', 'main_load_posts');
	add_action('wp_ajax_nopriv_loadmoreposts', 'main_load_posts');
  • Вопрос задан
  • 127 просмотров
Пригласить эксперта
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Похожие вопросы