Ajax фильтрация с WP Query внутри цикла foreach - PullRequest
1 голос
/ 29 февраля 2020

Я пытаюсь сделать календарь для отображения классов в день в почасовом порядке.

Мой начальный запрос для отображения всех результатов работает, как ожидалось. У меня есть foreach l oop, основанный на таксономии Дня, которая возвращает понедельник - воскресенье в виде семи списков. В l oop есть WP_Query, возвращающий все классы для каждого указанного c дня с использованием tax_query > $day->term_id и перечисляющий их под указанным c именем дня, с которым они связаны.

Существует фильтр на основе на переключателях, которые фильтруют запрос на основе таксономии типов классов. Идея состоит в том, чтобы фильтровать посты, но по-прежнему отображать результаты в течение недели для oop (надеюсь, что это имеет смысл).

Я использую Ax ios для выполнения запроса POST, который, кажется, работает, он возвращает 200 и результаты изменения внешнего интерфейса, проблема в том, что результаты не верны. Когда результаты фильтруются, кажется, что все сообщения отображаются только в понедельник, а не только требуемые результаты в каждый указанный c день. Я предполагаю, что проблема заключается в том, что запрос находится в foreach l oop (с я не делал раньше). Если кто-то может указать, где я иду не так, или поставить меня на правильный путь, это было бы очень полезно :)

Заранее спасибо!

**Class calendar foreach loop and WP_Query**

    <?php
    `$calendarDays = get_terms('calendar-day');`

    `echo '<div class="classes-calendar">';`



     `$classesFilter = array_map(function($class) {`
        `return [
          'value' => $class->term_id, 
          'title' => $class->name
        ];
      }, get_terms('calendar-class-type'));`

  `get_part('classes-filter', [
    'id' => 'classes-filter',
    'title' => 'All',
    'items' => array_merge( $classesFilter )
  ]);`

 ` echo '<div id="response" class="container">';`

    foreach ($calendarDays as $day):

      echo '<div class="classes-col">';
      echo '<strong>' . $day->name . '</strong>';
      echo '<ul>';

      $args = array(
        'post_type' => 'calendar',
        'tax_query' => array(
          array(
            'taxonomy' => 'calendar-day',
            'field' => 'id',
            'terms' =>  $day->term_id,
          )
        ),
        'meta_key' => 'classes_entry_start_time',
        'orderby' => 'meta_value_num',
        'order' => 'ASC'
      );

      $query = new WP_Query( $args );

      if( $query->have_posts() ):

        while( $query->have_posts() ):
        $query->the_post();

        get_part('classes-item', ['classesEntry' => get_field('classes_entry')]);

        endwhile;

      echo '</ul>';
      echo '</div>'; // END classes-col

      else:
        echo 'Sorry but something went wrong.';
      endif;

    endforeach;

  `echo '</div>'; // END container`
`echo '</div>'; // END classes-calendar`

`echo '<div class="container section"><div class="center"><a href="#" class="btn">Book class</a></div></div>';`

`wp_reset_query();`


**Ajax handler**


    function class_type_ajax() {

  `$calendarDays = get_terms('calendar-day');`

    foreach ($calendarDays as $day):

      echo '<div class="classes-col">';
      echo '<strong>T ' . $day->name . '</strong>';
      echo '<ul>';

      $args = array(
        'post_type' => 'calendar',
        'tax_query' => $tax,
        'meta_key' => 'classes_entry_start_time',
        'orderby' => 'meta_value_num',
        'order' => 'ASC',
        'post_per_page' => '1'
      );

      $test = $day->term_id;

      if(isset($test)) {
        $tax[] = array(
          'taxonomy' => 'calendar-day',
          'field' => 'name', // id
          'terms' => $test, //  $day->term_id,
        );
      }

      if(isset($_POST['classType'])) {
        $tax[] = array(
          'taxonomy' => 'calendar-class-type',
          'field' => 'id',
          'terms' => $_POST['classType']
        );
      }

      $query = new WP_Query( $args );

      if( $query->have_posts() ):

        while( $query->have_posts() ):
        $query->the_post();

        get_part('classes-item', ['classesEntry' => get_field('classes_entry')]);

        endwhile;

      echo '</ul>';
      echo '</div>'; // END classes-col

      else:
        echo 'Sorry but something went wrong.';
      endif;

    endforeach;

    die();
`}`

`add_action('wp_ajax_class_type_filter', 'class_type_ajax');
add_action('wp_ajax_nopriv_class_type_filter', 'class_type_ajax');`

**Ajax**

<div class="snippet" data-lang="js" data-hide="false" data-console="true" data-babel="false">
<div class="snippet-code">
<pre class="snippet-code-js lang-js prettyprint-override"><code>    import axios from 'axios';

    const loadmore = () => {

      const el = document.querySelector('#classes-filter');

      if (el) {

        el.addEventListener('change', e => {
          e.preventDefault();

          let formData = new FormData();

          formData.append('action', 'class_type_filter');
          formData.append('security', WP.security);

          // Axios POST request
          axios({
            method: 'POST',
            url: WP.ajax,
            data: formData,
          })
            // handle success
            .then(function (response) {
              console.log(response.data);
              console.log(response.status);
              document.getElementById("response").innerHTML = response.data;
              WP.current_page++;
            },
              (error) => {
                console.log(error);
              });

        });

      }

    };

    export default loadmore;
Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...