How to implement a custom field filter in Wordpress?

Question

JavaScript

Hello.
You need to filter the list of cars by their make.

Here is the form

<form action="<?php echo site_url() ?>/wp-admin/admin-ajax.php" method="POST" id="filter">
<h3>Продажа автомобилей</h3>
<div class="sel">
  <?php
  $arg = array(
  'post_type' => 'car_cars');
  $auto_q = new WP_Query ($arg);
  if ($auto_q->have_posts()) : ?>

  <select name="mark" id="mark" style="width: 457px">
  <option disabled selected value="Марка">Марка</option>
  <?php
  while ($auto_q->have_posts()) : $auto_q->the_post();
  $auto_mark = get_post_meta($post->ID, 'mark', true ) ? get_post_meta($post->ID, 'mark', true ) : '';
  ?>
  <option value="<?php echo $auto_mark; ?>"><?php echo $auto_mark; ?></option>
  <?php
  endwhile;
  wp_reset_postdata(); ?>
  </select>
  <?php endif; ?>
</div>

<div class="form_button"><button class="button_p" href="#">Найти</button></div>

</form>

Here is the auto display section:

<section class="auto_sec">
  <h3>авто <span class="button_y button_y1">в наличии</span></h3>
  <?php
  $arg = array(
  'post_type' => 'car_cars',);
  $auto_q = new WP_Query ($arg);
  if ($auto_q->have_posts()) : ?>

  <div class="auto_i">
  
  <?php
  while ($auto_q->have_posts()) : $auto_q->the_post();
  $auto_mark = get_post_meta($post->ID, 'mark', true ) ? get_post_meta($post->ID, 'mark', true ) : '';
    $auto_model = get_post_meta($post->ID, 'model', true ) ? get_post_meta($post->ID, 'model', true ) : '';
    $auto_year = get_post_meta($post->ID, 'year', true ) ? get_post_meta($post->ID, 'year', true ) : '';
    $auto_price = get_post_meta($post->ID, 'price', true ) ? get_post_meta($post->ID, 'price', true ) : '';
    $auto_motor = get_post_meta($post->ID, 'motor', true ) ? get_post_meta($post->ID, 'motor', true ) : '';
    $auto_kpp = get_post_meta($post->ID, 'kpp', true ) ? get_post_meta($post->ID, 'kpp', true ) : '';
    $auto_probeg = get_post_meta($post->ID, 'probeg', true ) ? get_post_meta($post->ID, 'probeg', true ) : '';
    $auto_kuzov = get_post_meta($post->ID, 'kuzov', true ) ? get_post_meta($post->ID, 'kuzov', true ) : '';
    $auto_img1 = get_post_meta($post->ID, 'img1', true ) ? get_post_meta($post->ID, 'img1', true ) : '';
  ?>


  <a href="<?php echo get_permalink(); ?>" class="auto_item">

      <div class="auto_img" style="background-image: url(<?php echo $auto_img1; ?>)">
        <ul>
          <li><?php echo $auto_motor; ?></li>
          <li><?php echo $auto_kpp; ?></li>
          <li><?php echo $auto_probeg; ?></li>
          <li><?php echo $auto_kuzov; ?></li>
        </ul>
        <span class="button_y button_y1">
        <?php echo $auto_price; ?> руб.</span>
      </div>
      <h3><?php echo $auto_mark; ?> <?php echo $auto_model; ?> <?php echo $auto_year; ?> г.</h3>
  </a>

  <?php
  endwhile;
  wp_reset_postdata(); ?>
  </div>
  <?php endif; ?>
  <a class="button_p" href="#">Все объявления</a>
</section>

Tell me how to do it?

Answer 1

In the auto display section, add the meta_key and meta_value keys to the $arg array.
It should look something like this:

$arg = array(
  'post_type' => 'car_cars',
  'meta_key' => 'mark',
  'meta_value' => $_POST['mark']
);
  $auto_q = new WP_Query ($arg);

You can read about meta_key and meta_value here: get_posts