wake-up-neo.com

So senden Sie ein Suchformular korrekt ab und zeigen das Ergebnis auf einer unabhängigen Seite an

Ich habe eine Teilesuchfunktion auf meiner WordPress-Website, die ein dynamisches Auswahlfeld verwendet.

Jetzt habe ich jedoch folgendes Problem:

Wenn Sie nur das erste oder die ersten beiden Kästchen auswählen und auf die Schaltfläche Search klicken, wird erfolgreich zur Ergebnisseite gesprungen.

Wenn Sie jedoch kontinuierlich das dritte Kästchen auswählen, wird zu einer Seite mit derselben URL wie die Ergebnisseite, jedoch mit dem Inhalt der Startseite gesprungen.

Ich überprüfe die Chrome-Konsole und sehe diesen Fehler:

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

Ich habe alle relativen Code unten.

1. Schriftart-Endteil der Auswahlfelder: 

<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="">Select Manufacturer</option>
    <?php
        if($rowCount > 0){
            while($row = $query->fetch_assoc()){
                echo '<option value="'.$row['manufact_id'].'">'.$row['manufact_name'].'</option>';
            }
        }else{
            echo '<option value="">Manufacturer Not Available</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="">Select Manufacturer First</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="">Select Type First</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="">Select Year First</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="Search">


<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="">Select Type First</option>');
                    }
                });
            }else{
                $('#type').html('<option value="">Select Manufact First</option>');
                $('#year').html('<option value="">Select Type First</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="">Select Year First</option>');
                    }
                });
            }else{
                $('#year').html('<option value="">Select Type First</option>');
                $('#model').html('<option value="">Select Year First</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="">Select Year First</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="">Select Type</option>';
        while($row = $query->fetch_assoc()){
            echo '<option value="'.$row['type_id'].'">'.$row['type_name'].'</option>';
        }
    }else{
        echo '<option value="">Type Not Available</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="">Select Year</option>';
        while($row = $query->fetch_assoc()){
            echo '<option value="'.$row['year_id'].'">'.$row['year_name'].'</option>';
        }
    }else{
        echo '<option value="">Year Not Available</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="">Select Model</option>';
        while($row = $query->fetch_assoc()){
            echo '<option value="'.$row['model_id'].'">'.$row['model_name'].'</option>';
        }
    }else{
        echo '<option value="">Model Not Available</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 "Manufacturer:\t".$rows['manufacturer'].'<br>';
                            echo "Type:\t".$rows['type'].'<br>';
                            echo "Year:\t".$rows['year'].'<br>';
                            echo "Model:\t".$rows['model'].'<br>';
                            echo '<br>';
                            echo "Description:\t".$rows['description'].'<br>';
                        ?>
                        </h4>                           
                    </div>
                </div>
            </div>
        <?php endwhile; ?>
        </div>
    </div>

    <?php get_footer(); ?>

Ich dachte, es könnte ein Problem mit der falschen Verwendung von POST in WordPress geben. Ich habe ein Tutorial gefunden: Umgang mit POST Fordert den WordPress-Weg an

Ich habe bereits action verwendet, um zur Ergebnisseite zu springen. Ich habe keine Ahnung, wie ich mein Problem lösen soll.

phpsearchmysqlformsselect
6
L. Leo

Gehen Sie folgendermaßen vor, um Ihre eigene unabhängige Suchfunktion zu erstellen.

1- Sie benötigen ein Formular, um die Daten für Sie zu senden. Dies ist ein einfaches Formular, das dies für Sie erledigen kann:

<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="Find my dream car!"/>
</form>

Welcher /my-page/ ist der Slug für die Seite, die wir später erstellen werden.

2- Eine Funktion zur Bearbeitung der Suchergebnisse. Schauen Sie sich diese Grundfunktion an, die die Autos anhand der eingegebenen Werte durchsucht:

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('WHATEVER TEMPLATE YOU WANT TO USE');
        }
    }
    // Pagination goes here
}

3- Eine Seite, auf der Ihre Suchergebnisse angezeigt werden. Erinnern Sie sich an die Schnecke in der ersten Anforderung? Erstellen Sie eine Seite im Verzeichnis Ihrer Vorlage und benennen Sie sie wie page-my-search-template.php. Fügen Sie diese Funktion dann in Ihre neue Seitenvorlage ein, wo immer Sie möchten:

my_custom_search();

Sie sollten dann eine Seite mit my-page slug (die Seite in der Aktion des Formulars) erstellen, indem Sie die soeben erstellte Vorlage verwenden.

Jetzt wird bei jedem Absenden des Formulars eine Suchanfrage ausgelöst und die Ergebnisse in Ihrer eigenen Suchvorlage angezeigt!

WARTEN !! Ich will meine Paginierung !!

Sie können Ihre eigene Paginierung in der Suchfunktion implementieren. Ich empfehle jedoch die Verwendung von WP-PageNavi für diejenigen, die nicht über ausreichende Kenntnisse verfügen, um ein Paginierungsskript zu schreiben. Installieren Sie das Plugin und stellen Sie die Abfrage wie folgt ein:

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

Auf diese Weise haben Sie eine Paginierung für Ihre benutzerdefinierte Suchseite, schön und einfach.

1
Jack Johansson

Sie brauchen keine mySQL-Abfragen. Die Standardsuche von WordPress ist das Senden von "s" mit der URL. Sie können dies mit einem einfachen Formular mit versteckten Eingaben erreichen.

<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="Search...">
  <input type="submit" class="form-submit" value="Submit">
</form>

Dieses Formular wird unter derselben URL gesendet. Nach Einreichungen soll dies geschehen-

<?php
  if( isset( $_GET['careers_search'] ) ) {
    // Your code goes here...
  }
?>
0
Neit