WN

WN (https://www.wn.se/forum/index.php)
-   Klientsidans teknologier, design och grafik (https://www.wn.se/forum/forumdisplay.php?f=12)
-   -   JQuery slider, val av prisintervall (https://www.wn.se/forum/showthread.php?t=1042917)

boromb 2010-07-14 08:52

JQuery slider, val av prisintervall
 
Hej,

Jag försöker få till en jquery slider som ska användas till att välja prisintervall
på min sajt.

En enklare version som efter "slide" visar vald pris i en inputbox har jag lyckats med men
nu skulle jag vilja göra det lite mer avancerat genom att via samma objekt välja från och till.

http://docs.jquery.com/UI/Slider

Svårt att hitta någonting på google. Söker jag på "jquery slider" får jag många träffar men
många handlar om annan typ av slider.

All typ av hjälp välkomnas!

Ha det bra!

hnn 2010-07-14 09:08

http://interface.eyecon.ro/demos/slider.html

http://interface.eyecon.ro/demos/slider_minmax.html


Den nedre är nog vad du söker.. Kolla källkoden för att ser hur det är löst.

boromb 2010-07-14 09:33

Citat:

Ursprungligen postat av hnn (Inlägg 20362486)
http://interface.eyecon.ro/demos/slider.html

http://interface.eyecon.ro/demos/slider_minmax.html


Den nedre är nog vad du söker.. Kolla källkoden för att ser hur det är löst.

Tusen tack!

Ha det bra!

boromb 2010-07-14 12:10

Citat:

Ursprungligen postat av hnn (Inlägg 20362486)
http://interface.eyecon.ro/demos/slider.html

http://interface.eyecon.ro/demos/slider_minmax.html


Den nedre är nog vad du söker.. Kolla källkoden för att ser hur det är löst.

Fick, kanske konstigt nog, aldrig igång detta så jag letade för första gången efter
"jquery slider price range" och fick fram länken till följande exempel som är mycket enklare
att få igång.

http://jqueryui.com/demos/slider/range.html

Ha det gott!

Clarence 2010-07-14 13:31

Citat:

Ursprungligen postat av boromb (Inlägg 20362503)
Fick, kanske konstigt nog, aldrig igång detta så jag letade för första gången efter
"jquery slider price range" och fick fram länken till följande exempel som är mycket enklare
att få igång.

http://jqueryui.com/demos/slider/range.html

Ha det gott!

Det beror nog på att koden du fick har ett antal år på nacken och jQuery har utvecklats rätt mycket sedan dess. Interface har ersatts av jQuery UI sedan runt 3 år. Så att välja jQuery UI framför ett bibliotek som kräver att du använder jQuery 1.1 gör du rätt i.

Under demos and documentation på jQuery UIs hemsida hittar du annars alltid bra info om deras widgets. Se t ex http://jqueryui.com/demos/slider/ Dels exempel-kod med min-värde och sedan nedanför ordentlig dokumentation över min/max och allt annat.

boromb 2010-07-14 13:46

Citat:

Ursprungligen postat av Clarence (Inlägg 20362510)
Det beror nog på att koden du fick har ett antal år på nacken och jQuery har utvecklats rätt mycket sedan dess. Interface har ersatts av jQuery UI sedan runt 3 år. Så att välja jQuery UI framför ett bibliotek som kräver att du använder jQuery 1.1 gör du rätt i.

Under demos and documentation på jQuery UIs hemsida hittar du annars alltid bra info om deras widgets. Se t ex http://jqueryui.com/demos/slider/ Dels exempel-kod med min-värde och sedan nedanför ordentlig dokumentation över min/max och allt annat.

Tackar tackar!
Börjar så småningom förstår hur detta fungerar :)

boromb 2010-07-14 13:57

Här kommer koden som skapar min prisintervallslider.
Jag hämtar högsta möjliga priset via PHP och sätter in det
som max värde.
Jag skulle vilja att values man valde sparades till nästa gång och då
tänkte jag mig använda kakor.
Enligt information på nätet kan jag sätta kaka på följande vis som också syns i koden
$.cookie("mt_sok_pris_fran", ui.values[0]);

Om jag försöker sätta start value för slidern till kakans värde så får jag aldrig fram slidern.
values:[0,$.cookie("mt_sok_pris_till")],
Detta fungerar ej då själva syntaxen för att ta fram kakans värde aldrig "körs" och det som skrivs ut som value är själva syntaxen "$.cookie("mt_sok_pris_till")"

Hur gör jag för att kakans värde ska skrivas ut i value?

Här kommer nuvarande kod:

$("#slider").slider(
{
range: true,
min: 0,
max: <?php echo $hogst_pris;?>,
step:10000,
values:[0,<?php echo $hogst_pris;?>],

slide: function(event, ui) {
$("#sok_pris_fran").val(ui.values[0]);
$("#sok_pris_till").val(ui.values[1]);
},

stop: function(event, ui) {
$.cookie("mt_sok_pris_fran", ui.values[0]);
$.cookie("mt_sok_pris_till", ui.values[1]);
}
});

boromb 2010-07-14 15:29

Hittade till slut vad mina bekymmer berodde på.
För att $.cookie ska fungera måste en jquery plugin laddas och den
hittas på följande sida:
http://plugins.jquery.com/project/cookie

Ha det!


Alla tider är GMT +2. Klockan är nu 09:24.

Programvara från: vBulletin® Version 3.8.2
Copyright ©2000 - 2025, Jelsoft Enterprises Ltd.
Svensk översättning av: Anders Pettersson