Erstellen einer Seite mit Bild und Schieberegler darunter

Question

Hallo,

meine Probanden durchlaufen drei IATs und sollen, nach den IATs, per explizitem Rating, alle Bilder, die in den drei IAT benutzt wurden per Schieberegler bewerten.
Wie kann ich das umsetzen, dass ein Bild pro Seite und darunter ein Schieberegler (1-100) angezeigt wird? Und das dann natürlich für alle 48 benutzten Bilder. Die Bilder sollen, um Reihenfolgeeffekte zu vermeiden, in zufälliger Reihenfolge angezeigt werden (randomisierte Darstellung).

Beste Grüße,
Michael

Answer 1

Ich würde hier zu einer Schieberegler-Frage mit 48 Item raten und diese dann per loopPage() abarbeiten lassen:

$i = loopPage(48);
question('SR01', $i + 1);

Die Anzeige des Bildes würde dann - je nachdem wie die BIlder vorliegen - z.B. über ein Array funktionieren.

$bilder = array(
  1 => 'stadt01.jpg',
  2 => 'land01.jpg',
  3 => 'fluss01.jpg',
  // u.s.w.
);

$i = loopPage(48);
html('<div style="text-align: center; margin-bottom: 2em"><img src="'.$bilder[$i].'" alt=""></div>');
question('SR01', $i + 1);

Comments

Wie und wo genau muss ich den Code eingeben? Ich habe gerade versucht ihn bei "Fragebogen zusammenstellen" in ein HTML-Block zu packen. In der Vorschau wird mir allerdings nur der Code mit einem Schieberegler darunter angezeigt.
das // u.s.w. habe ich entfernt, meine Dateinamen hinzugefügt (1 => 'Natur01.png', etc.) und die 48 zu 120 geändert, da ich mit all meinen Bildern noch einen Pretest durchführen wollte. Muss ich noch etwas ändern?

---

Sie benötigen PHP-Code: https://www.soscisurvey.de/help/doku.php/de:create:php

---

Jetzt passiert etwas. Allerdings werden mir noch immer keine Bilder angezeigt (hochgeladen sind sie und die Bezeichnungen stimmen auch). Scheinbar versucht das Programm mehrere Bilder auf der gleichen Seite anzuzeigen.
Außerdem werden mit 3 Fragen auf der Seite angezeigt, obwohl ich nur ein Item erstellt habe.

Im PHP-Code trat ein Fehler auf.
Fehler im Fragebogen: Undefined offset: 0
Zeile: 128
PHP-Code

125 );
126
127 $i = loopPage(120);
128 html('<div style="text-align: center; margin-bottom: 2em"><img src="'.$bilder[$i].'" alt=""></div>');
129 question('EX01', $i + 1);
130 return 'ok';

Bitte entschuldigen Sie die Umstände. Leider arbeite ich das erste Mal mit SoSciSurvey und PHP/HTML.

Danke für den Link zum PHP-Code. Den hatte ich tatsächlich noch nicht gesehen.

---

> Fehler im Fragebogen: Undefined offset: 0

Pardon, das Bilder-Array hat ja indizes, die bie 1 beginnen und nicht bei 0. Bitte ändern Sie das $bilder[$i] zu $bilder[$i + 1], also

html('<div style="text-align: center; margin-bottom: 2em"><img src="'.$bilder[$i + 1].'" alt=""></div>');

Wenn Sie danach immer noch keine Bilder sehen, prüfen Sie bitte, ob auch die Klein-/Großschreibung bei den Dateinamen inkl. Dateiendung stimmt.

---

Eine Fehlermeldung bekomme ich jetzt nicht mehr angezeigt, allerdings wird, trotz beachteter Groß-/Kleinschreibung kein Bild angezeigt (In Safari ein Platzhalter (Blaues Kästchen mit "?" drin, trotz aktiviertem Java) und in Firefox(windowsrechner) wird garkein Bild angezeigt. Könnte das auch daran liegen, dass mir komischerweise ein Schieberegler und 2 zusätzliche Skalen auf der Seite angezeigt werden, obwohl ich nur ein Item mit einem Schieberegler angelegt habe?

---

Hab den Fehler entdeckt. Manche Dateinamen sind zwar im Ordner Bilder und Mediendateien klein geschrieben. Bei Fragenbogen zusammenstellen allerdings groß.
Außerdem war mir nicht klar, dass ich

$i = loopPage(48);
question('SR01', $i + 1);

am anfang weglassen kann... so hat es mir zusätzliche Skalen auf die Seite gepackt.

Wenn ich jetzt noch das Prozentzeichen bei der angezeigten Zahl vom Schieberegler weg bekomme, bin ich glücklich.

Vielen, vielen Dank für die Unterstützung!

---

Nein, diese Zeile sollten Sie nicht weglassen - sie sorgt dafür, dass aus der Frage ST01 jeweils das richtige Item angezeigt wird. Aber wenn Sie noch Fragen "in die Seite gezogen" haben, dann sollten Sie diese unbedingt entfernen.

> Wenn ich jetzt noch das Prozentzeichen bei der angezeigten Zahl vom Schieberegler weg bekomme, bin ich glücklich.

Wie das geht, finden Sie unten in der Anleitung zum Schieberegler.

---

$i = loopPage(48);
question('SR01', $i + 1);
$bilder = array(
  1 => 'stadt01.jpg',
  2 => 'land01.jpg',
  3 => 'fluss01.jpg',
  // u.s.w.
);

$i = loopPage(48);
html('<div style="text-align: center; margin-bottom: 2em"><img src="'.$bilder[$i].'" alt=""></div>');
question('SR01', $i + 1);

Wenn ich den Code so benutze funktioniert's nicht und ich bekomme auf einer Seite einen Schieberegler und zwei 11er-Skalen angezeigt.
Lasse ich jedoch die ersten beiden Zeilen weg funktioniert es wie gewünscht.

Ich habe keine weiteren Fragen in die Seite gezogen. Deswegen hatte ich mich gewundert, dass ich drei Skalen angezeigt bekam.

Dann schau ich nochmal in die Anleitung für die Schieberegler. Dankeschön!

---

Jetzt wollte ich gerade die 120 benötigten Items anlegen... musste aber feststellen, dass nur 99 anlegen kann. Wie könnte ich das Problem mit meinen verbleibenden 21 Bildern lösen?

---

In der ursprünglichen Frage ging es einmal um 48 Bilder, deshalb hatte ich diese Problematik nicht weiter verfolgt. Aber auch so ist das kein Problem: Legen Sie zwei Fragen (z.B. SR01 und SR02) an, 90 Items in der ersten Frage und 30 in der zweiten und verwenden Sie anstatt

question('SR01', $i + 1);

folgenden Code:

if ($i > 90) {
  question('SR02', $i + 1 - 90);
} else {
  question('SR01', $i + 1);
}

---

Ja, ich dachte, dass ich den gleichen Code auch für 120 Bilder nutzen kann.
Falsch gedacht...

Vielen Dank für die Hilfe.

---

Jetzt musste ich leider feststellen, dass die Reihenfolge der Bilder nicht gemischt werden. Kann man den Code durch shuffle() ergänzen? wenn ja, wie ginge das?
Shuffle($bilder); führt leider nicht zum gewünschten Ergebniss

---

Nicht die Bilder selbst sollten Sie mischen, sonst können Sie die Daten am Ende nicht mehr zuordnen. Aber deren Schlüssel:

$bilder = array( /// u.s.w.
if (!isset($keys)) {
  $keys = array_keys($bilder);
  shuffle($keys);
}
$x = loopPage(48);
$i = $keys[$i];
html('<div style="text-align: center; margin-bottom: 2em"><img src="'.$bilder[$i].'" alt=""></div>');
if ($i > 90) {
  question('SR02', $i + 1 - 90);
} else {
  question('SR01', $i + 1);
}

So, ich hoffe, ich habe nichts vergessen.

---

$bilder = array(
  1 => 'Orig1.png',
  2 => 'Orig2.png',
  3 => 'Orig3.png',
///usw.
);

if (!isset($keys)) {
  $keys = array_keys($bilder);
  shuffle($keys);
registerVariable($keys);
}

$i = loopPage(48);
$x = $keys[$i];

html('<div style="text-align: center; margin-bottom: 2em"><img src="'.$bilder[$x].'" alt=""></div>');

So hab ich's jetzt gelöst. Sie haben evtl. versehentlich $i und $x vertauscht? Im html Code hab ich dann "'.$bilder[$x].'".

Jetzt sieht die Ausgabe aus, wie sie sein soll. Danke für die Hilfe!

---

Im Code oben müsste es

$i = $keys[$x];

heißen. Aber Sie haben recht ... das +1 fällt auch weg, wenn man die array_keys() verwendet. Sehr schön :)

---

Leider musste ich jetzt noch feststellen, dass ich so mit den Daten nichts anfangen kann. Irgendwie muss ich ja den Wert des Schiebereglers dem Bild zuordnen können, das bewertet wird. Ich hab's über die put() funktion

for ($n=0; $n<count($keys); $n++) {
  $id = id('EX04', $keys[$n]);
   put($id, $n + 1);
}

versucht zu lösen. Leider scheint die Ausgabe der put()-Funktion nicht mit meiner tatsächlichen Bildreihenfolge übereinzustimmen.

Ich habe bereits einen neuen Post geöffnet, dachte aber ich füge es hier kurz hinzu, da ich ja oben geschrieben hatte, dass ich Bilder bewerten lasse (in zufälliger Reihenfolge).

---

Hab's gelöst bekommen

$n = 0;
foreach ($keys as $x) {
  $n++;
  put(id('EX04', $n), $x);
}

---

Wie im anderen Post geschrieben (hoffe ich) empfehle ich dringend, dass Sie zu einem bestimmten Bild immer dieselbe Frage anzeigen. Sonst landen Sie in der Datenanalyse-Hölle :)

---

Ja, habe ich - alles gut gegangen :)
https://support.soscisurvey.de/?qa=8584/put-funktion-gibt-nicht-die-richtige-reihenfolge-aus&show=8588#a8588