2010-10-27 24 views
0

J'utilise la bibliothèque YUI 2.7 pour gérer un contrôle à double curseur (curseur de plage) dans une page Web. Cela fonctionne très bien - cependant, je voulais permettre aux utilisateurs de changer les valeurs de la plage par Ajax - en changeant efficacement la gamme de prix de "0-50,000" à un sous-ensemble (par exemple "50-250") sans recharger la page. Le problème est qu'il semble que les valeurs du curseur existant ne soient pas réinitialisées, même si je les redéfinis explicitement à NULL dans la fonction pour "reconstruire" le curseur.Question de contrôle YUI API Dual Slider

Les poignées du curseur apparaissent hors de la position après la requête ajax (loin de l'échelle vers la droite) et les valeurs du curseur fluctuent apparemment de manière aléatoire.

Existe-t-il un moyen de détruire explicitement l'objet curseur YUI, au-delà de définir sa référence à null? Ou dois-je simplement redéclarer l'échelle et les valeurs min/max d'une manière ou d'une autre?

Merci pour toute aide (je vais essayer de poster un lien vers un exemple dès que possible)

est ici le code:

function slider(bg,minthumb,maxthumb,minvalue,maxvalue,startmin,startmax,aSliderName,soptions) { 
     var scaleFactor = null; 
     var tickSize = null; 
     var range = null; 
     var dual_slider = null; 
     var initVals = null; 
     var Dom = null; 

     range = options.sliderLength; 
     if ((startmax - startmin) < soptions.sliderLength) { 
      tickSize = (soptions.sliderLength/(startmax - startmin)); 
     }else{ 
      tickSize = 1; 
     } 

     initVals = [ 0,soptions.sliderLength ], // Values assigned during instantiation 
     //Event = YAHOO.util.Event, 
     dual_slider, 
     scaleFactor = ((startmax - startmin)/soptions.sliderLength); 

     dual_slider = YAHOO.widget.Slider.getHorizDualSlider(
     bg,minthumb,maxthumb,range, tickSize, initVals); 

     dual_slider.subscribe("change", function(instance) { 
      priceMin = (dual_slider.minVal * scaleFactor) + startmin; 
      priceMax = (dual_slider.maxVal * scaleFactor) + startmin; 
     }); 

     dual_slider.subscribe("slideEnd", function(){ alert(priceMin + ' ' + priceMax); }); 
     return dual_slider; 
    } 

Répondre

2

magasin le startmin, startmax et scaleFactor sur l'objet dual_slider, puis dans votre callback ajax, mettez à jour ces propriétés avec de nouvelles valeurs. Changez votre abonné d'événement de modification pour référencer this.startmin, this.startmax et this.scaleFactor. Slider et DualSlider ne comprennent vraiment que les décalages de pixels des pouces et signalent les valeurs en tant que telles. Comme vous l'avez fait (et dans la plupart des exemples Slider), vous devez appliquer un facteur de conversion pour convertir un décalage de pixel en une "valeur". Cet idiome commun a été intégré dans la logique de base du curseur YUI 3 (bien qu'il n'y ait pas encore de DualSlider dans la bibliothèque).

Voici un exemple qui illustre les plages de valeurs de mise à jour dynamique: http://yuiblog.com/sandbox/yui/v282/examples/slider/slider_factor_change.html

+0

grâce Luke-- c'est ce que je me demandais, et vous clouer vers le bas avec un exemple aussi! J'apprécie l'aide. – julio