Discussion :

[delta6]

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 :

Sélectionner tout - Visualiser dans une fenêtre à part

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 ] + " &agrave; " + ui.values[ 1 ] + " &euro;" );
      },
      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 ) + " &agrave; " + $( "#slider-prix" ).slider( "values", 1 ) + " &euro;" );
});

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

[danielhagnoul]

Bonsoir

Code corrigé :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

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 );
	         }
	      });
     }
});

[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

[danielhagnoul]

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

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 !

[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.