Cum să trimiteți corect un formular de căutare și să afișați rezultatul pe o pagină independentă

28 nov. 2016, 17:59:31
Vizualizări: 13.9K
Voturi: 6

Am o funcție de căutare pe site-ul meu WordPress care folosește selectoare dependente dinamice.

Totuși, acum am următoarea problemă:

Dacă selectez doar prima casetă, sau primele două casete și apăs butonul Căutare, aceasta redirecționează cu succes către pagina de rezultate.

Totuși, dacă selectez continuu a treia casetă, aceasta redirecționează către o pagină cu același URL ca pagina de rezultate dar cu conținutul paginii de start.

Am verificat în Chrome Console și am văzut această eroare:

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

Am inclus mai jos tot codul relevant.

1. partea front-end a selectoarelor:

<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="">Selectează Producător</option>
    <?php
        if($rowCount > 0){
            while($row = $query->fetch_assoc()){
                echo '<option value="'.$row['manufact_id'].'">'.$row['manufact_name'].'</option>';
            }
        }else{
            echo '<option value="">Producător Indisponibil</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="">Selectează mai întâi Producător</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="">Selectează mai întâi Tip</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="">Selectează mai întâi An</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="Căutare">

<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="">Selectează mai întâi Tip</option>');
                    }
                });
            }else{
                $('#type').html('<option value="">Selectează mai întâi Producător</option>');
                $('#year').html('<option value="">Selectează mai întâi Tip</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="">Selectează mai întâi An</option>');
                    }
                });
            }else{
                $('#year').html('<option value="">Selectează mai întâi Tip</option>');
                $('#model').html('<option value="">Selectează mai întâi An</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="">Selectează mai întâi An</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="">Selectează Tip</option>';
        while($row = $query->fetch_assoc()){
            echo '<option value="'.$row['type_id'].'">'.$row['type_name'].'</option>';
        }
    }else{
        echo '<option value="">Tip Indisponibil</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="">Selectează An</option>';
        while($row = $query->fetch_assoc()){
            echo '<option value="'.$row['year_id'].'">'.$row['year_name'].'</option>';
        }
    }else{
        echo '<option value="">An Indisponibil</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="">Selectează Model</option>';
        while($row = $query->fetch_assoc()){
            echo '<option value="'.$row['model_id'].'">'.$row['model_name'].'</option>';
        }
    }else{
        echo '<option value="">Model Indisponibil</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="" />';
                ?>
                <div class="caption">
                    <h4 class="group inner list-group-item-heading">
                    <?php
                        echo "Producător:\t".$rows['manufacturer'].'<br>';
                        echo "Tip:\t".$rows['type'].'<br>';
                        echo "An:\t".$rows['year'].'<br>';
                        echo "Model:\t".$rows['model'].'<br>';
                        echo '<br>';
                        echo "Descriere:\t".$rows['description'].'<br>';
                    ?>
                    </h4>                           
                </div>
            </div>
        </div>
    <?php endwhile; ?>
    </div>
</div>

<?php get_footer(); ?>

Am crezut că problema ar putea fi legată de utilizarea incorectă a POST în WordPress, am găsit un tutorial: Gestionarea cererilor POST în modul WordPress

Totuși, deja am folosit action pentru a redirecționa către pagina de rezultate, nu am idee cum să rezolv problema mea.

3
Comentarii

Ești sigur despre db_config.php? De ce să nu folosești global $wpdb? https://codex.wordpress.org/Class_Reference/wpdb. Ești sigur despre link-ul din acțiune, ai setat permalink-ul pentru a obține part-search-result.php?

Benoti Benoti
28 nov. 2016 20:46:57

Deoarece practic nu folosești niciuna dintre funcționalitățile încorporate ale WordPress, nu sunt sigur că aceasta ar aparține de WPSE... De ce să nu folosești ceea ce WP ți-a oferit deja

Jebble Jebble
21 mar. 2017 15:12:36

Tehnic, poți obține toate acestea fără a folosi interogări MySQL și utilizând doar interogările WP

Netanel Perez Netanel Perez
21 mar. 2017 13:42:29
Toate răspunsurile la întrebare 2
0

Pentru a crea propria funcționalitate independentă de căutare, urmați acești pași.

1- Aveți nevoie de un formular pentru a trimite datele. Acesta este un formular simplu care poate face acest lucru pentru dumneavoastră:

<form method="post" name="car-select" action="<?php echo site_url('/my-page/'); ?>">
    <select name="make">
        <option value="benz">Benz</option>
        <option value="bmw">BMW</option>
        <option value="audi">Audi</option>
    </select>
    <select name="type">
        <option value="sedan">Sedan</option>
        <option value="coupe">Coupe</option>
    </select>
    <input type="submit" value="Găsește mașina visurilor mele!"/>
</form>

Unde /my-page/ este slug-ul paginii pe care o vom crea mai târziu.

2- O funcție pentru a gestiona rezultatele căutării. Uitați-vă la această funcție de bază care caută mașinile în funcție de valorile introduse:

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('ORICE ȘABLON DORIȚI SĂ FOLOSIȚI');
        }
    }
    // Paginarea va fi aici
}

3- O pagină pentru a afișa rezultatele căutării. Vă amintiți de slug-ul din primul pas? Creați o pagină în directorul șablonului dumneavoastră și denumiți-o ca page-my-search-template.php. Apoi includeți această funcție în noul șablon de pagină, oriunde doriți:

my_custom_search();

Apoi ar trebui să creați o pagină cu slug-ul my-page (cel din acțiunea formularului), folosind șablonul pe care tocmai l-ați creat.

Acum, fiecare trimitere a formularului va declanșa o interogare de căutare și va afișa rezultatele în propriul dumneavoastră șablon de căutare!

STAI !! Vreau și paginarea !!

Puteți implementa propria paginare în funcția de căutare, dar recomand să folosiți WP-PageNavi pentru cei care nu au suficientă experiență pentru a scrie un script de paginare. Instalați plugin-ul și setați interogarea astfel:

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

Astfel veți avea o paginare pentru pagina personalizată de căutare, simplu și ușor.

23 mai 2017 09:02:53
0

Nu ai nevoie de nicio interogare mySQL. Căutarea implicită din WordPress trimite parametrul "s" prin URL. Poți realiza acest lucru cu un simplu formular cu câmpuri ascunse.

<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="Caută...">
  <input type="submit" class="form-submit" value="Trimite">
</form>

Acest formular se va trimite pe același URL. După trimitere, acesta este comportamentul așteptat:

<?php
  if( isset( $_GET['careers_search'] ) ) {
    // Codul tău va fi aici...
  }
?>
19 apr. 2017 17:52:34