[PHP/MySQ/ajax] Zwrotne przesłanie zmiennych do formularza, po wciśnięciu przycisku WSTECZ w przeglądarce Opcje

[Przemo75]

Witam.
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:

[HTML] pobierz, plaintext 
<div class="select-box">
<div class="page-header">
<label>Marka :</label>
<select name="marka" class="marka">
<option value="" selected="selected">---Marka---</option>
<?php
include_once 'get_marka.php';
?>
</select>
 
<label>Model :</label>
<select name="model" class="model">
<option value="" selected="selected">---Model---</option>
</select>
 
<label>Rocznik :</label>
<select name="rocznik" class="rocznik">
<option value="" selected="selected">---Rocznik---</option>
</select>
</div>
</div>
<div class="" id="display">
 <!-- Tutaj wyświetlone są wyniki z wyszukiwarki -->
</div>
[HTML] pobierz, plaintext 

Plik get_marka.php (analogicznie są zrobione get_model.php i get_rocznik.php)

[PHP] pobierz, plaintext 
<?php
session_start();
var_dump($_SESSION);
?>
<?php
	$stmt=$DB_con->prepare("SELECT marka FROM haki2 GROUP BY marka");
	$stmt->execute();
echo "Akcja=" . $action ."\n";
	while($row=$stmt->fetch(PDO::FETCH_ASSOC))
	{
	$marka = $row['marka'];
?>
	<option value="<?php echo $marka; ?>"><?php echo $marka; ?></option>
<?php
	}
?>
[PHP] pobierz, plaintext 

Plik js_haki.js odpowiedzialny za obsługę formularza

[JAVASCRIPT] pobierz, plaintext 
$(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);
			} 
		});
	});
 
});
[JAVASCRIPT] pobierz, plaintext 

[trueblue]

W pierwszym <select> zaznaczasz opcję na podstawie zmiennej w sesji, a do dwóch pozostałych zaczytujesz i zaznaczasz na podstawie pozostałych zmiennych.

select1 - zaznaczony na podstawie $id_marka,
select2 - rekordy (modele) wybrane na podstawie $id_marka i zaznaczona opcja na podstawie $id_model
select3 - rekordy (roczniki) wybrane na podstawie $id_model i zaznaczona opcja na podstawie $id_rocznik

Jeśli, którejś zmiennej brak, to zostawiasz zależny od niej i podrzędne selecty puste.

[Przemo75]

Po WSTECZnym, pole select marki wyświetla ostatnio wybraną markę, ale pozostałe 2 select'y są puste. Poza tym, wyświetla wszystkie marki.
Dla zobrazowania

[trueblue]

Ale zaczytujesz dane do tych selectów w PHP (nie poprzez Ajax)?

[Przemo75]

No chyba to jest ze sobą powiązane.

[trueblue]

No chyba nie. Ajax jest wywoływany przy zmianie wartości w <select>. To co opisałem powinieneś zrobić przy generowaniu zawartości strony.
Od biedy możesz wywoływać zdarzenia wyboru wartości w listach ze skryptu - element.trigger('change').

P.S. Jeszcze lepiej by było gdybyś użył History API, wtedy w adresie URL mógłbyś umieszczać kolejne parametry.

[Przemo75]

Kurcze, nie znam tego.
Tak się zastanawiam, czy nie pomogła by zmiana przesyłania zmiennych z post na get (3 kroki wyszukiwarki)? Wówczas mógłbym zamienić na "przyjazne linki" i byłoby OK?

[trueblue]

Nic to nie zmieni, bo przesyłasz dane Ajaxem, czyli strona się nie przeładowuje.
Gdybyś używał wspomnianego History API, to wtedy mógłbyś użyć.

Jeszcze raz:
1. trigger('change') przy załadowaniu strony na liście 2 i 3,
2. lub wypełnienie list (już w PHP przy generowaniu strony/HTML) na podstawie zapamiętanych w sesji zmiennych.

[Przemo75]

Zmieniłem wszystkie Select'y na:

[PHP] pobierz, plaintext 
<?php
if($marka = $_SESSION['marka']){
?>
<label>Marka :</label>
<select name="marka" class="marka">
<option value="<?php echo $marka; ?>"><?php echo $marka; ?></option>
<?php
include_once 'get_marka.php';
?>
<?php
}else{
?>
<label>Marka :</label>
<select name="marka" class="marka">
<option value="" selected="selected">---Marka---</option>
<?php
include_once 'get_marka.php';
?>
</select>
<?php
}
?>
 
<?php
if($model = $_SESSION['model']){
?>
<label>Model :</label>
<select name="model" class="model">
<option value="<?php echo $model; ?>"><?php echo $model; ?></option>
<?php
}else{
?>
<label>Model :</label>
<select name="model" class="model">
<option value="" selected="selected">---Model---</option>
</select>
<?php
}
?>
 
<?php
if($rocznik = $_SESSION['rocznik']){
?>
<label>Rocznik :</label>
<select name="rocznik" class="rocznik">
<option value="<?php echo $rocznik; ?>"><?php echo $rocznik; ?></option>
<?php
}else{
?>
<label>Rocznik :</label>
<select name="rocznik" class="rocznik">
<option value="" selected="selected">---Rocznik---</option>
</select>
<?php
}
?>
[PHP] pobierz, plaintext 

Po tej zmianie pierwszy select wyświetla nazwę wybranej wcześniej marki, rocznik również wyświetlony jest w Select, ale zniknął drugi select (model) - wyświetla tylko jego nazwę.
Natomiast zawartość (poniżej wyszukiwarki, w której wyświetlane są wybrane rekordy, jest pusta.

Chyba, że powinienem coś jeszcze zmienić w przywoływanym w ajaxie pliku pokaz_haki.php:

[PHP] pobierz, plaintext 
<?php
	include('dbconfig.php');
	$action = $_REQUEST['action'];
 
	if ($action=='showAll')
	{
		$id = "0";
	} else {
		$id=$_POST['id'];
	}
 
	switch(true)
	{
	case ($action == 'showAll' OR ($action == 'marka' and $id == '')):
    default: 
		$stmt=$DB_con->prepare('SELECT marka FROM haki2 GROUP BY marka');
		$stmt->execute();
    break;
 
    case ($action == 'marka' OR ($action == 'model' and $id == '')):
	$marka = $_POST['marka'];
		$stmt=$DB_con->prepare('SELECT model FROM haki2 WHERE marka=:marka GROUP BY model ORDER BY model');
		$stmt->execute(array(':marka'=>$marka));
    break;
 
    case ($action == 'model' OR ($action == 'rocznik' and $id == '')):
	$marka = $_POST['marka'];
	$model=str_replace("\\", "", $_POST['model']);
		$stmt=$DB_con->prepare('SELECT rok_produkcji FROM haki2 WHERE model=:model GROUP BY rok_produkcji ORDER BY rok_produkcji');
		$stmt->execute(array(':model'=>$model));
    break;
 
    case ($action == 'rocznik'):
	$marka = $_POST['marka'];
	$model=str_replace("\\", "", $_POST['model']);
	$rocznik=str_replace("\\", "", $_POST['rocznik']);
		$stmt=$DB_con->prepare('SELECT * FROM haki2 WHERE model=:model AND rok_produkcji=:rocznik ORDER BY rok_produkcji');
		$stmt->execute(array(':model'=>$model, ':rocznik'=>$rocznik));
    break;
	}
?>
[PHP] pobierz, plaintext 

Ten post edytował Przemo75 1.04.2018, 18:26:42