Onglet et slider qui disparait

Version imprimable

Salut à tous,

J'ai un souci avec un silder, j'utilise jquery ui et j'utilise ce modèle de slider http://jqueryui.com/resources/demos/slider/range.html

J'ai sur une page 2 onglets crée à partir de $( "#tabs" ).tabs(); dans le premier onglet il y a un petit formulaire pour rechercher mes produits et dans le second onglet il y a un formulaire de recherche plus complet avec un range slider et des input select.

Quand j'accède à ma page c'est donc le premier onglet qui s'affiche (le petit formulaire), quand je clique sur le 2ième onglet mon formulaire s'affiche correctement, le slider est visible et il fonctionne parfaitement bien. Mais lorsque je re-clique sur le premier onglet et que je re-clique sur le 2ième onglet mon slider a disparu, il n'est plus visible, je dois ré-actualiser ma page et re-cliquer sur mon 2ième onglet pour voir de nouveau ce slider.

Quand je regarde avec Firebug il me signale cela $(...).slider is not a function et m'indique que c'est cette ligne stop: function( event, ui ) { qui bug lorsque je re-clique sur le 2ième onglet pour la 2ième fois.

Voici le code de mon slider, voyez-vous une erreur :
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 $(function() { $( "#slider-prix" ).slider({ range: true, min: 1, max: 40000, step: 500, values: [ <?php echo $check_prix_exp[1];?>, <?php echo $check_prix_exp[2];?> ], slide: function( event, ui ) { $( "#prix_exp" ).val( ui.values[ 0 ] + " à " + ui.values[ 1 ] + " €" ); }, change: function( event, ui ) { var loader = "../images/ajax-loader.gif"; $('#frame_prix').html('').html('<img src="' + loader + '" alt="#">'); }, stop: function( event, ui ) { var value1 = ui.values[ 0 ]; var value2 = ui.values[ 1 ]; $.ajax({ url: "../scripts/ajax/ajaxPrixExpert.php", data: "num_exp="+$("#num_exp").val()+"+"&quantite="+$("#quantite").val(), error: function(jqXHR, textStatus, errorThrown) { $('#frame_prix').html('').html('<div class="error">Erreur !</div>'); }, success: function( data ) { $( "#frame_prix" ).html( data ); } }); } }); $( "#prix_exp" ).val( $( "#slider-prix" ).slider( "values", 0 ) + " à " + $( "#slider-prix" ).slider( "values", 1 ) + " €" ); });
Avez-vous une idée pour résoudre ce problème, ça fait 1 journée que je suis dessus et rien à faire ?

Merci pour vos réponses et votre aide.

Bruno

Bonsoir

Code corrigé :

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
$( "#slider-prix" ).slider({
	"range" : true,
	"min" : 1,
    "max" : 40000,
    "step" : 500,
    "values" : [ <?php echo $check_prix_exp[1];?>, <?php echo $check_prix_exp[2];?> ],
    "slide" : function( event, ui ){
    	$( "#prix_exp" ).val( ui.values[ 0 ] + " &agrave; " + ui.values[ 1 ] + " &euro;" );
    },
    "change" : function( event, ui ) {
      	$( '#frame_prix' ).html( '<img src="../images/ajax-loader.gif" alt="#">' );
    },
    "stop" : function( event, ui ) {
	      $.ajax({
	         "url" : "../scripts/ajax/ajaxPrixExpert.php",
	         "data" : { "num_exp" : $("#num_exp").val(), "quantite" : $("#quantite").val() },
	         "dataType" : "html",
	         "error" : function(jqXHR, textStatus, errorThrown) {
		         $( '#frame_prix' ).html( '<div class="error">Erreur !</div>' );
	         },
	         "success" : function( data ) {
		         $( "#frame_prix" ).html( data );
	         }
	      });
     }
});

16/03/2013, 10h08
delta6

Merci pour ta réponse mais ça ne marche pas mieux, le problème est toujours là :?

Ca marche parfaitement bien lorsque j'accède la première fois à mon deuxième onglet mais pas les fois suivantes :?
16/03/2013, 10h50
danielhagnoul

"ca marche ou ca ne marche pas" n'est pas très informatif !:aie:

Citation:

Envoyé par delta6

Quand je regarde avec Firebug il me signale cela $(...).slider is not a function et m'indique que c'est cette ligne stop: function( event, ui ) { qui bug lorsque je re-clique sur le 2ième onglet pour la 2ième fois.

Toujours la même erreur ou une autre ?

Sans la totalité des codes (HTML, CSS, JS, jamais PHP) difficile de tester quoi que ce soit !
18/03/2013, 09h45
delta6

Problème résolu, il y a vait un conflit javascript avec d'autres widgets présents sur ma page : un caroussel et une lightbox.

Merci pour votre aide.