Forum PHP.pl

Witam,
potrzebuję pomocy.
Tworzę właśnie webowy interfejs do sterowania oświetleniem i wyzwalania gotowych scen, natomiast muszę również stworzyć suwak, który będzie działał w zakresie 0-100% i w zależności od zakresu (najlepiej co 1%) działał jako href do konkretnej podstrony.

Tzn. moje przyciski to są np. trigger/10, trigger/11, trigger/12 więc jeśli suwak w zakresie 0-100% będzie ustawiony na 11% to uruchamia się href do trigger/11

Póki co znalazłem skrypt samego suwaka, lecz nie wiem jak zrobić żeby wysyłać href w zależności od położenia

[HTML] pobierz, plaintext 
<script>
  $( function() {
    $( "#slider-vertical" ).slider({
      orientation: "vertical",
      range: "min",
      min: 0,
      max: 100,
      value: 0,
      slide: function( event, ui ) {
        $( "#amount" ).val( ui.value );
    });
    $( "#amount" ).val( $( "#slider-vertical" ).slider( "value" ) );
  } );
  </script>
[HTML] pobierz, plaintext 

A jakiego slidera używasz? Zobacz w jego dokumentacji, cze nie ma eventu typu "on change", wtedy sie po prostu pod to podpinasz

Znalazłem w internecie: https://jqueryui.com/slider/#slider-vertical

Ok,
natomiast nie za bardzo wiem jak zrobić wartościowe wysyłanie hrefa, czyli to co mówiłem, kiedy value wynosi 0 to href wysyła /trigger/0, kiedy value wynosi 27 to trigger/27

hrefa sie nigdzie nie wysyla

href to jest atrybut tagu a.

Powiedz dokladniej o co chodzi bo nie do konca rozumiem..

Ze zdarzenia "change" wyciągniesz wartosc suwaka, np. 15 i sobie skleisz stringa,



I sobie gdzieś to umieścisz.

Wyjaśniam:
o tyle ile znam się na html/css oraz trochę php to nie znam się za bardzo na java, a muszę zrobić jeden suwak, który będzie działał w zakresie od 0-100%. Obecnie z tego skryptu, który znalazłem działa i nawet przedstawia ustawioną wartość obok suwaka. Ja jednak potrzebuję takiej funkcjonalności jak w zależności od ustawienia suwaka zostanie uruchomione przejście do konkretnej podstrony.

Czyli: suwak ustawiam na 24 i wtedy uruchamia się przejście do podstrony xyz/24
suwak ustawiam na 73 i wtedy uruchamia się przejście do podstrony xyz/73

No to tak jak napisałem w poprzednim poście





I zobacz to: https://developer.mozilla.org/en-US/docs/We...Window/location

Do zmiany adresu (zeby zmienic strone).

Mniej więcej rozumiem, gorzej ze sklepaniem tego, muszę zrobić to z mojego przykładu dla #slider-vertical czy #amount?

Może jakiś przykład jak to powinno wyglądać?

Spróbuj sam, napisz coś jak nie będzie wychodzić to wrzuć kod i pomogę.

No niestety nawet nie wiem jak dobrze zacząć, nie chce wrzucać czegoś co i tak będzie od razu źle zrobione, bo tak jak mówiłem, nie za bardzo znam java i nigdy czegoś takiego nie robiłem, a potrzebuję jedynie tej jednej funkcjonalności.

Może uda Ci się wrzucić jakiś przykład, który by mnie naprowadził jak coś takiego powinno wyglądać w praktyce?

[PHP] pobierz, plaintext 
  <script>
  $( function() {
    $( "#slider-vertical" ).slider({
      orientation: "vertical",
      range: "min",
      min: 0,
      max: 100,
      value: 0,
      slide: function( event, ui ) {
        $( "#amount" ).val( ui.value );
    });
    $( "#amount" ).val( $( "#slider-vertical" ).slider( "value" ));
    onchange: function (event, ui) {
    	var currentValue = <tutaj nie wiem co wpisać>;
    	var newHref = "trigger/01" + currentValue?? - to znaczy? 
    }
  } );
  </script>
[PHP] pobierz, plaintext 

Czy powinno to być zbudowane na zasadzie if,else?

Czy nikt nie jest w stanie mi pomóc?

Ten post edytował dnaielpro 16.11.2016, 14:19:52

Wrzuć kod na jakiegoś jsfiddla, zeby bylo widac ten slider jak dziala i dalo sie edytowac kod.

Oto link do plików: http://jsfiddle.net/w4ppLc6t/

Czy powinno to wyglądać tak?

[PHP] pobierz, plaintext 
 $( function() {
    $( "#slider-vertical" ).slider({
      orientation: "vertical",
      range: "min",
      min: 0,
      max: 100,
      value: 0,
      step: 1,
      change: function( event, ui ) {
    location.href = "/trigger/" + ui.value
},
      slide: function( event, ui ) {
        $( "#amount" ).val( ui.value );
      }
    });
    $( "#amount" ).val( $( "#slider-vertical" ).slider( "value" ) );
  } );
 
});
[PHP] pobierz, plaintext