Kann man per HTML dargestellte Platzhalter nach einem Schieberegler auf der gleichen Seite anpassen?

Question

Die Teilnehmenden haben eine Entscheidung zur Abgabe und basierend auf dieser Verändern sich meherere Faktoren, die alle gekoppelt an den Slider-Wert verändert werden sollen (siehe Bild). Ist das möglich?

Vielen Dank im Voraus und liebe Grüße!

Answer 1

Ja, möglich ist es, aber Sie müssen ein wenig in JavaScript einsteigen.

Als erstes würden Sie die Platzhalter nicht als SoSci-Platzhalter bauen, sondern als HTML-Elemente mit Namen, z.B.

Your personal goal part in percent: <span id="pcPersonal">0</span>%

Das würden Sie dann bei jeder Änderung des Schiebereglers anpassen, z.B.

<script type="text/javascript">
<!--
// The slider will not be available before the page has been loaded
SoSciTools.attachEvent(window, "load", function() {
  var slider = SoSciSliders.getSlider("AB01_01");
  // The "click" event will fire when the respondents moves the slider
  slider.addEventListener("click", function() {
    if (slider.getValue() > 0) {
          document.getElementById("pcPersonal").innerHTML = Math.round(101 - slider.getValue());
    }
  });
});

Comments

Super, mit der Hilfe bekomme ich es sicher hin.

Vielen Dank!