Po wyselekcjonowaniu wyników zapytania z "potrójnej" wyszukiwarki (bez przeładowania strony) i wyborze jednego z nich, wynik z rozszerzonym opisem wyświetlony jest na nowej stronie.
Niestety po kliknięciu przycisku WSTECZ w przeglądarce, strona z wyszukiwarką traci ustawienia, jakie zostały wybrane do wyświetlenia wyników.
Do zwrotnego przesłania parametrów zastosowałem funkcję $_SESSION, ale niestety nie bardzo wiem, jak to "podpiąć" pod wyszukiwarkę.
Wyszukiwarka:
<div class="select-box"> <div class="page-header"> <select name="marka" class="marka"> <?php include_once 'get_marka.php'; ?> </select> <select name="model" class="model"> </select> <select name="rocznik" class="rocznik"> </select> </div> </div> <div class="" id="display"> <!-- Tutaj wyświetlone są wyniki z wyszukiwarki --> </div>
Plik get_marka.php (analogicznie są zrobione get_model.php i get_rocznik.php)
<?php ?> <?php $stmt=$DB_con->prepare("SELECT marka FROM haki2 GROUP BY marka"); $stmt->execute(); while($row=$stmt->fetch(PDO::FETCH_ASSOC)) { $marka = $row['marka']; ?> <?php } ?>
Plik js_haki.js odpowiedzialny za obsługę formularza
$(document).ready(function() { // function to get all records from table function getAll() { $.ajax ({ url: 'pokaz_haki.php', data: 'action=showAll', cache: false, success: function(r) { $("#display").html(r); } }); } getAll(); // function to get all records from table $('body').on('click','img.marka_auta',function() { var id = $(this).attr("alt"); $('body').find('select.marka').val(id); $(".marka").trigger('change'); }); $('body').on('click','div.model_auta',function() { var id = $(this).html(); $('body').find('select.model').val(id); $(".model").trigger('change'); }); $('body').on('click','div.rocznik_auta',function() { var id = $(this).html(); $('body').find('select.rocznik').val(id); $(".rocznik").trigger('change'); }); $(".marka").change(function() { var id=$(this).val(); var marka = $('body').find('select.marka').val(); var dataString = 'id='+ id + '&action=marka' + '&marka=' + marka; $.ajax ({ type: "POST", url: "get_model.php", data: dataString, cache: false, success: function(html) { $(".model").html(html); } }); $.ajax ({ type: "POST", url: "pokaz_haki.php", data: dataString, cache: false, success: function(r) { $("#display").html(r); } }); }); $(".model").change(function() { var id=$(this).val(); var marka = $('body').find('select.marka').val(); var model = $('body').find('select.model').val(); var dataString = 'id=' + id + '&action=model' + '&marka=' + marka + '&model=' + model; $.ajax ({ type: "POST", url: "get_rocznik.php", data: dataString, cache: false, success: function(html) { $(".rocznik").html(html); } }); $.ajax ({ type: "POST", url: "pokaz_haki.php", data: dataString, cache: false, success: function(r) { $("#display").html(r); } }); }); $(".rocznik").change(function() { var id=$(this).val(); var marka = $('body').find('select.marka').val(); var model = $('body').find('select.model').val(); var rocznik = $('body').find('select.rocznik').val(); var dataString = 'id=' + id + '&action=rocznik' + '&marka=' + marka + '&model=' + model + '&rocznik=' + rocznik; $.ajax ({ type: "POST", url: "get_rocznik.php", data: dataString, cache: false, success: function(html) { $(".links").html(html); } }); $.ajax ({ type: "POST", url: "pokaz_haki.php", data: dataString, cache: false, success: function(r) { $("#display").html(r); } }); }); });