[AJAX] avec un sliders de prix

Bonsoir,

Voila je souhaite mettre en place un slider pour sélectionner une tranche de prix mais j'ai des petits soucis
voici mon code :

Code:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
 
<script language="javascript" type="text/javascript">
function prix(mini_velo,maxi_velo) 
{ 	
	var xhr_object = null;
 
	if(window.XMLHttpRequest) // Firefox
		xhr_object = new XMLHttpRequest();
	else if(window.ActiveXObject) // Internet Explorer
		xhr_object = new ActiveXObject("Microsoft.XMLHTTP");
	else { // XMLHttpRequest non supporté par le navigateur
		alert("Votre navigateur ne supporte pas les objets XMLHTTPRequest...");
		return;
	}
 
	var data     = null;
 
	xhr_object.open("GET", "/ajax/prix.php?prix_max_velo="+maxi_velo+"&prix_min_velo="+mini_velo, true);
 
	xhr_object.onreadystatechange = function() {
	   if(xhr_object.readyState == 4) {
		  self.location.href="<? echo $_SERVER['REQUEST_URI'] ?>";
 
	   }
}
   	xhr_object.setRequestHeader("Content-type", "application/x-www-form-urlencoded");
	xhr_object.send(data);
 
 
}
 
jQuery(document).ready(function($){
	/*
	 * Sliders
	**/
	$("#slider_prix").slider({
		range:  true,
		min:    0,
		max:    11999.00,
		values: [154, 441],
		slide: function(event, ui){
			$('#prix_min').html(ui.values[0]);
			$('#prix_max').html(ui.values[1]);
			prix(ui.values[0],ui.values[1]);
		}
			});
	$('#prix_min').html($("#slider_prix").slider("values", 0));
	$('#prix_max').html($("#slider_prix").slider("values", 1));
});</script>

le slide fonctionne très bien les prix affichées aussi, par contre il tente de rafraicihir la page trop souvent j'ai donc modifié le code de la fonction comme ceci :

Code:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
 
<script language="javascript" type="text/javascript">
jQuery(document).ready(function($){
	/*
	 * Sliders
	**/
	$("#slider_prix").slider({
		range:  true,
		min:    0,
		max:    11999.00,
		values: [154, 441],
		change: function(event, ui){
			$('#prix_min').html(ui.values[0]);
			$('#prix_max').html(ui.values[1]);
			prix(ui.values[0],ui.values[1]);
		}
			});
	$('#prix_min').html($("#slider_prix").slider("values", 0));
	$('#prix_max').html($("#slider_prix").slider("values", 1));
});</script>

maintenant la page s'actualise correctement mais plus le prix en direct, il s'affiche au raffraichissement de la page j'ai donc essayé de combiner la fonction slide et change sur la meme fonction comme ceci

Code:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
 
<script language="javascript" type="text/javascript">
jQuery(document).ready(function($){
	/*
	 * Sliders
	**/
	$("#slider_prix").slider({
		range:  true,
		min:    0,
		max:    11999.00,
		values: [154, 441],
		slide: function(event, ui){
			$('#prix_min').html(ui.values[0]);
			$('#prix_max').html(ui.values[1]);
			prix(ui.values[0],ui.values[1]);
		}
		change: function(event, ui){
			prix(ui.values[0],ui.values[1]);
		}
	});
	$('#prix_min').html($("#slider_prix").slider("values", 0));
	$('#prix_max').html($("#slider_prix").slider("values", 1));
});</script>

mais là le slide ne s'affiche pas :(

pouvez vous donner un coup de pouce ?
Merci d'avance
Bonne soirée
Ludo