Русский
ru

Как правильно отправить поисковую форму и отобразить результат на отдельной странице

28 нояб. 2016 г., 17:59:31
Просмотры: 13.9K
Голосов: 6

На моем сайте WordPress есть функция поиска деталей с использованием динамически зависимых select-боксов.

Однако у меня возникла следующая проблема:

Если выбрать только первый бокс или первые два бокса и нажать кнопку Search, происходит успешный переход на страницу результатов.

Но если выбрать также третий бокс, происходит переход на страницу с тем же URL, что и страница результатов, но с содержимым главной страницы.

В консоли Chrome я вижу следующую ошибку:

Failed to load resource: the server responded with a status of 404 (Not Found)

Ниже представлен весь относящийся к проблеме код.

1. Фронтенд-часть select-боксов:

<form class="select-boxes" action="<?php echo site_url("/part-search-result/"); ?>" method="POST" target="_blank">
    <?php include(__DIR__.'/inc/part-search.php'); ?>
</form>

2. part-search.php

<?php
    include( __DIR__.'/db-config.php' );
    $query = $db->query("SELECT * FROM ps_manufact WHERE status = 1 ORDER BY manufact_name ASC");
    $rowCount = $query->num_rows;
?>

<select name="manufacturer" id="manufact" onchange="manufactText(this)">
    <option value="">Выберите производителя</option>
    <?php
        if($rowCount > 0){
            while($row = $query->fetch_assoc()){
                echo '<option value="'.$row['manufact_id'].'">'.$row['manufact_name'].'</option>';
            }
        }else{
            echo '<option value="">Производители не найдены</option>';
        }
    ?>
</select>
<input id="manufacturer_text" type="hidden" name="manufacturer_text" value=""/>
<script type="text/javascript">
    function manufactText(ddl) {
        document.getElementById('manufacturer_text').value = ddl.options[ddl.selectedIndex].text;
    }
</script>

<select name="type" id="type" onchange="typeText(this)">
    <option value="">Сначала выберите производителя</option>
</select>
<input id="type_text" type="hidden" name="type_text" value=""/>
<script type="text/javascript">
    function typeText(ddl) {
        document.getElementById('type_text').value = ddl.options[ddl.selectedIndex].text;
    }
</script>

<select name="year" id="year" onchange="yearText(this)">
    <option value="">Сначала выберите тип</option>
</select>
<input id="year_text" type="hidden" name="year_text" value=""/>
<script type="text/javascript">
    function yearText(ddl) {
        document.getElementById('year_text').value = ddl.options[ddl.selectedIndex].text;
    }
</script>

<select name="model" id="model" onchange="modelText(this)">
    <option value="">Сначала выберите год</option>
</select>
<input id="model_text" type="hidden" name="model_text" value=""/>
<script type="text/javascript">
    function modelText(ddl) {
        document.getElementById('model_text').value = ddl.options[ddl.selectedIndex].text;
    }
</script>

<input type="submit" name="search" id="search" value="Поиск">

<script type="text/javascript">
    jQuery(function($) {
        $('#manufact').on('change',function(){
            var manufactID = $(this).val();
            if(manufactID){
                $.ajax({
                    type:'POST',
                    url:'<?php echo home_url('wp-content/themes/myTheme/inc/ajax-data.php') ?>',
                    data:'manufact_id='+manufactID,
                    success:function(html){
                        $('#type').html(html);
                        $('#year').html('<option value="">Сначала выберите тип</option>');
                    }
                });
            }else{
                $('#type').html('<option value="">Сначала выберите производителя</option>');
                $('#year').html('<option value="">Сначала выберите тип</option>');
            }
        });

        $('#type').on('change',function(){
            var typeID = $(this).val();
            if(typeID){
                $.ajax({
                    type:'POST',
                    url:'<?php echo home_url('wp-content/themes/myTheme/inc/ajax-data.php') ?>',
                    data:'type_id='+typeID,
                    success:function(html){
                        $('#year').html(html);
                        $('#model').html('<option value="">Сначала выберите год</option>');
                    }
                });
            }else{
                $('#year').html('<option value="">Сначала выберите тип</option>');
                $('#model').html('<option value="">Сначала выберите год</option>');
            }
        });

        $('#year').on('change',function(){
            var yearID = $(this).val();
            if(yearID){
                $.ajax({
                    type:'POST',
                    url:'<?php echo home_url('wp-content/themes/myTheme/inc/ajax-data.php') ?>',
                    data:'year_id='+yearID,
                    success:function(html){
                        $('#model').html(html);
                    }
                });
            }else{
                $('#model').html('<option value="">Сначала выберите год</option>');
            }
        });
    });
</script>

3. ajax-data.php

<?php

include( __DIR__.'/db-config.php' );

if(isset($_POST["manufact_id"]) && !empty($_POST["manufact_id"])){
    $query = $db->query("SELECT * FROM ps_type WHERE manufact_id = ".$_POST['manufact_id']." AND status = 1 ORDER BY type_name ASC");

    $rowCount = $query->num_rows;

    if($rowCount > 0){
        echo '<option value="">Выберите тип</option>';
        while($row = $query->fetch_assoc()){
            echo '<option value="'.$row['type_id'].'">'.$row['type_name'].'</option>';
        }
    }else{
        echo '<option value="">Типы не найдены</option>';
    }
}

if(isset($_POST["type_id"]) && !empty($_POST["type_id"])){
    $query = $db->query("SELECT * FROM ps_year WHERE type_id = ".$_POST['type_id']." AND status = 1 ORDER BY year_name ASC");

    $rowCount = $query->num_rows;

    if($rowCount > 0){
        echo '<option value="">Выберите год</option>';
        while($row = $query->fetch_assoc()){
            echo '<option value="'.$row['year_id'].'">'.$row['year_name'].'</option>';
        }
    }else{
        echo '<option value="">Года не найдены</option>';
    }
}

if(isset($_POST["year_id"]) && !empty($_POST["year_id"])){
    $query = $db->query("SELECT * FROM ps_model WHERE year_id = ".$_POST['year_id']." AND status = 1 ORDER BY model_name ASC");

    $rowCount = $query->num_rows;

    if($rowCount > 0){
        echo '<option value="">Выберите модель</option>';
        while($row = $query->fetch_assoc()){
            echo '<option value="'.$row['model_id'].'">'.$row['model_name'].'</option>';
        }
    }else{
        echo '<option value="">Модели не найдены</option>';
    }
}

?>

4. part-search-result.php

<?php

if (isset($_POST['search'])) {
    $clauses = array();
    if (isset($_POST['manufacturer_text']) && !empty($_POST['manufacturer_text'])) {
        $clauses[] = "`manufacturer` = '{$_POST['manufacturer_text']}'";
    }
    if (isset($_POST['type_text']) && !empty($_POST['type_text'])) {
        $clauses[] = "`type` = '{$_POST['type_text']}'";
    }
    if (isset($_POST['year_text']) && !empty($_POST['year_text'])) {
        $clauses[] = "`year` = '{$_POST['year_text']}'";
    }
    if (isset($_POST['model_text']) && !empty($_POST['model_text'])) {
        $clauses[] = "`model` = '{$_POST['model_text']}'";
    }
    $where = !empty( $clauses ) ? ' where '.implode(' and ',$clauses ) : '';
    $sql = "SELECT * FROM `wp_products` ". $where;
    $result = filterTable($sql);
} else {
    $sql = "SELECT * FROM `wp_products` WHERE `manufacturer`=''";
    $result = filterTable($sql);
}

function filterTable($sql) {
    $con = mysqli_connect("localhost", "root", "root", "i2235990_wp2");
    if (!$con) {
        die('Could not connect: ' . mysqli_error($con));
    }
    $filter_Result = mysqli_query($con, $sql);
    return $filter_Result;
}

?>

    <?php get_header(); ?>

    <div class="container">
        <div id="products" class="row list-group">
        <?php while ( $rows = mysqli_fetch_array($result) ): ?>
            <div class="item col-xs-12 col-sm-4 col-md-4 col-lg-4">
                <div class="thumbnail">
                    <?php
                        echo '<img name="product-image" class="group list-group-image hvr-bob" src=' . $rows['image_url'] . ' width="400px" height="250px" alt="Изображение продукта" title="Изображение продукта" />';
                    ?>
                    <div class="caption">
                        <h4 class="group inner list-group-item-heading">
                        <?php
                            echo "Производитель:\t".$rows['manufacturer'].'<br>';
                            echo "Тип:\t".$rows['type'].'<br>';
                            echo "Год:\t".$rows['year'].'<br>';
                            echo "Модель:\t".$rows['model'].'<br>';
                            echo '<br>';
                            echo "Описание:\t".$rows['description'].'<br>';
                        ?>
                        </h4>                           
                    </div>
                </div>
            </div>
        <?php endwhile; ?>
        </div>
    </div>

    <?php get_footer(); ?>

Я предположил, что проблема может быть в неправильном использовании POST в WordPress, и нашел руководство: Обработка POST-запросов в WordPress

Однако я уже использую атрибут action для перехода на страницу результатов, и не знаю, как решить эту проблему.

php поиск mysql формы выбор
3
Комментарии

Вы уверены насчет db_config.php? Почему не использовать global $wpdb? https://codex.wordpress.org/Class_Reference/wpdb. Вы уверены в ссылке в action, вы настроили постоянные ссылки для получения part-search-result.php?

Benoti Benoti
28 нояб. 2016 г. 20:46:57

Поскольку вы практически не используете встроенные функции WordPress, я не уверен, что это относится к WPSE.. Почему бы не использовать то, что WP уже сделал для вас

Jebble Jebble
21 мар. 2017 г. 15:12:36

Технически вы можете достичь всего этого без использования MySQL запросов, используя только WP запросы

Netanel Perez Netanel Perez
21 мар. 2017 г. 13:42:29
Все ответы на вопрос 2
0
2

Чтобы создать собственную независимую поисковую функциональность, выполните следующие шаги.

1- Вам нужна форма для отправки данных. Вот простая форма, которая может это сделать:

<form method="post" name="car-select" action="<?php echo site_url('/my-page/'); ?>">
    <select name="make">
        <option value="benz">Mercedes</option>
        <option value="bmw">BMW</option>
        <option value="audi">Audi</option>
    </select>
    <select name="type">
        <option value="sedan">Седан</option>
        <option value="coupe">Купе</option>
    </select>
    <input type="submit" value="Найти машину мечты!"/>
</form>

Здесь /my-page/ — это ярлык (slug) страницы, которую мы создадим позже.

2- Функция для обработки результатов поиска. Взгляните на этот базовый пример, который ищет автомобили по заданным параметрам:

function my_custom_search() {
    $car_make = $_POST['make'];
    $car_type = $_POST['type'];
    $car_query = new WP_Query ( array (
        'post_type' => 'post',
        'tax_query' => array(
            'relation' => 'AND',
            array (
                'taxonomy' => 'car_make',
                'field' => 'slug',
                'terms' => $car_make,
            ),
            array (
                'taxonomy' => 'car_type',
                'field' => 'slug',
                'terms' => $car_type,
            ),
         ),
    ));
    if ($car_query->have_posts) {
        while($car_query->have_posts()){
            $car_query->the_post();
            get_template_part('ШАБЛОН, КОТОРЫЙ ВЫ ХОТИТЕ ИСПОЛЬЗОВАТЬ');
        }
    }
    // Здесь будет пагинация
}

3- Страница для отображения результатов поиска. Помните slug из первого шага? Создайте страницу в директории вашего шаблона с именем, например, page-my-search-template.php. Затем добавьте эту функцию в ваш новый шаблон страницы в нужном месте:

my_custom_search();

После этого создайте страницу с ярлыком my-page (как в атрибуте action формы), используя только что созданный шаблон.

Теперь при каждой отправке формы будет запускаться поисковый запрос, а результаты будут отображаться в вашем собственном шаблоне поиска!

ПОГОДИТЕ !! А КАК НАСЧЁТ ПАГИНАЦИИ?!

Вы можете реализовать свою пагинацию в поисковой функции, но я рекомендую использовать WP-PageNavi для тех, у кого недостаточно навыков для написания скрипта пагинации. Установите плагин и настройте запрос следующим образом:

wp_pagenavi(array( 'query' => $car_query ));

Таким образом, вы получите пагинацию для своей пользовательской поисковой страницы — просто и удобно.

23 мая 2017 г. 09:02:53
0
0

Вам не нужны никакие mySQL-запросы. Стандартный поиск WordPress передает параметр "s" в URL. Этого можно добиться с помощью простой формы со скрытыми полями.

<form role="search" method="get" action="<?php echo $_SERVER['REQUEST_URI']; ?>">
  <input type="hidden" name="action" value="careers_search">
  <input type="text" name="search-career" value="Поиск...">
  <input type="submit" class="form-submit" value="Отправить">
</form>

Эта форма будет отправлять данные на тот же URL. После отправки должно произойти следующее:

<?php
  if( isset( $_GET['careers_search'] ) ) {
    // Ваш код здесь...
  }
?>
19 апр. 2017 г. 17:52:34
Похожие вопросы
Пагинация на пользовательском шаблоне страницы
2
ответов
Пагинация и счетчик результатов в Woocommerce после пользовательского цикла
1
ответов
Как работает проверка nonce в WordPress?
1
ответов
Фильтрация второго выпадающего списка при выборе значения в первом
1
ответов
Добавление дополнительных данных к объекту WP_Post в WordPress
4
ответов
Когда WordPress очищает столбец post_content_filtered в базе данных?
1
ответов