Welcome to the LimeSurvey Community Forum

Ask the community, share ideas, and connect with other LimeSurvey users!

Erscheinen von Fragen nach Bestätigung auf derselben Seite

  • BernadetteSchorn
  • BernadetteSchorn's Avatar Topic Author
  • Offline
  • New Member
  • New Member
More
1 week 4 days ago #269940 by BernadetteSchorn
Ihre LimeSurvey-Version: 6.12.3
Eigener Server oder LimeSurvey-Cloud: limesurvey.net (cloud)
Genutzte Designvorlage: Sea Green (default)
==================

Liebe LimeSurvey-Community,

ich habe Schwierigkeiten ein vorgegebenes Umfragedesign technisch in LimeSurvey umzusetzen und hoffe ihr könnt mir helfen!

Die Vorgaben für das Umfragedesign sind wie folgt:
  • Der gesamte Fragebogen besteht aus 20 sog. „Items“.
  • Die 20 Item sollen untereinander in festgelegten Gruppen randomisiert sein.
  • Jedes Item besteht aus genau 3 Fragen.
  • Die 3 Fragen für jedes Item müssen in einer festen Reihenfolge beantwortet werden. Grund: Die erste Frage ist eine inhaltliche Single-Choice-Frage zu einer gezeigten Abbildung. Die zweite Frage fragt danach, wie sicher man sich bei der gegebenen Antwort auf die erste Frage ist (Single-Choice mit 6 Stufen von „völlig unsicher“ bis „völlig sicher“). Die dritte Frage fragt nach einer Begründung für die gegebene Antwort auf die erste Frage (Single-Choice).
  • Jedes Item ist auf einer eigenen Seite. Auf der Seite zu einem Item sind dann die zu dem Item gehörigen 3 Fragen. (D.h. die drei zu einem Item gehörigen Fragen sind nicht auf verschiedenen Seiten.)
Diese Vorgaben habe ich wie folgt erfolgreich umgesetzt bekommen:
  • Jedes einzelne der 21 Items ist eine „Gruppe“.
  • Die 3 Fragen zu jedem Item sind jeweils als „Frage“ innerhalb der Gruppe angelegt.
  • Als „Format“ für die Umfrage habe ich „Gruppe für Gruppe“ ausgewählt, damit jede Gruppe (d.h. jedes Item) auf einer eigenen Seite erscheint.
So weit, so gut.

Nun zu dem schwierigen Teil, den ich nicht hinbekomme: Für die 3 Fragen zu jedem Item gibt es die folgenden weiteren Vorgaben, die ich umsetzen muss:
  • Gelangt der Umfrageteilnehmer auf eine Seite mit einem neuen Item, so darf zunächst nur die erste Frage angezeigt werden. (Die anderen beiden Fragen dürfen nicht zu sehen sein.) Der Teilnehmer hat nun beliebig viel Zeit eine Antwort auf die Frage auszuwählen.
  • Hat sich der Teilnehmer für eine Antwort entschieden, so muss er das bestätigen. Für die Bestätigung hätte ich gerne einen Knopf mit der Beschriftung „weiter“ o.ä.
  • Hat der Teilnehmer seine Antwort auf die erste Frage bestätigt, so soll die zweite Frage direkt unter der ersten Frage erscheinen. Die erste Frage (und die dort ausgewählte Antwort) bleibt aber sichtbar. Die auf die erste Frage gegebene Antwort darf sich jedoch nicht mehr ändern lassen. D.h. der Teilnehmer sieht jetzt die erste und die zweite Frage, kann aber nur die zweite Frage beantworten.
  • Hat sich der Teilnehmer für eine Antwort auf die zweite Frage entschieden, so muss er das wieder bestätigen. Für die Bestätigung hätte ich gerne wieder einen Knopf mit der Beschriftung „weiter“ o.ä.
  • Hat der Teilnehmer seine Antwort auf die zweite Frage bestätigt, so soll die dritte Frage direkt unter der zweiten Frage erscheinen. Die zweite Frage (und die dort ausgewählte Antwort) bleibt auch sichtbar. Die auf die zweite Frage gegebene Antwort darf sich aber nicht mehr ändern lassen. D.h. der Teilnehmer sieht jetzt die erste, die zweite und die dritte Frage, kann aber nur die dritte Frage beantworten.
  • Hat sich der Teilnehmer für eine Antwort auf die dritte Frage entschieden, so muss er das wieder bestätigen und gelangt zum nächsten Item.
Ich habe versucht diese weiteren Vorgaben umzusetzen, habe das aber nicht hinbekommen. Was mir gelungen ist, ist, mithilfe einer „Bedingung“ die zweite und dritte Frage anzeigen zu lassen, wenn für die jeweils vorherige eine Antwort gegeben wurde.

Was mir aber nicht gelungen ist:
  • Wie kann ich eine Bestätigungsknopf („weiter“) einbauen, s.o.?
  • Wie erreiche ich es, dass die bereits abgegebenen (bestätigten) Antworten nicht mehr änderbar sind, nachdem man diese bestätigt hat?
Ich hoffe ihr könnt mir da weiterhelfen.

Vielen Dank schon mal und viele Grüße!

Please Log in to join the conversation.

  • Joffm
  • Joffm's Avatar
  • Offline
  • LimeSurvey Community Team
  • LimeSurvey Community Team
More
1 week 4 days ago - 1 week 4 days ago #269941 by Joffm
Hallo,
auch wenn mir unklar ist, was dieses "Bestätigen" soll 
fällt mir als Erstes ein
"Zeige 'Frage für Frage' an".
Damit muss der Teilnehmer ja den "Weiter"-Button klicken (um zu "bestätigen".
Jetzt soll ja noch die Antwort auf die vorherige "readonly" dargestellt werden.
Gut, da sollte sicher eine ansprechend gestylte Darstellung im Fragetext der folgenden Frage ausreichen (piping mit ExpressionScript).

Andererseits kannst Du natürlich zwischen die Fragen jeweils eine Frage "bootstrap buttons" mit nur einem Button "Bestätigung" einfügen, mit den css-Klassen "no-question" und "no-bottom" visuell zusammenschieben, und mit irgendwie javascript die zweite Frage zunächst verstecken und rrst anzeigen, wenn der entsprechende Button geklickt ist.
Allerdings fällt mir gerade nichts ein, was die vorherige Frage auf "readonly" setzt.
Da müsste man einmal im Forum herumsuchen.

Am besten wäre es natürlich, Du würdest den lss-Export eines kleinen Prototypen (nur drei, vier Gruppen) schicken.

Bis dann
Joffm 

Volunteers are not paid.
Not because they are worthless, but because they are priceless
Last edit: 1 week 4 days ago by Joffm.

Please Log in to join the conversation.

  • Joffm
  • Joffm's Avatar
  • Offline
  • LimeSurvey Community Team
  • LimeSurvey Community Team
More
1 week 3 days ago - 1 week 2 days ago #269950 by Joffm
Ich habe einmal etwas gespielt.
Du sagst

Hat der Teilnehmer seine Antwort auf die erste Frage bestätigt, so soll die zweite Frage direkt unter der ersten Frage erscheinen. Die erste Frage (und die dort ausgewählte Antwort) bleibt aber sichtbar. Die auf die erste Frage gegebene Antwort darf sich jedoch nicht mehr ändern lassen. D.h. der Teilnehmer sieht jetzt die erste und die zweite Frage, kann aber nur die zweite Frage beantworten.

Meine Idee dazu war

Jetzt soll ja noch die Antwort auf die vorherige "readonly" dargestellt werden.
Gut, da sollte sicher eine ansprechend gestylte Darstellung im Fragetext der folgenden Frage ausreichen (piping mit ExpressionScript).

Und genau dies zeige ich hier.

 
In der zweiten Frage ist oben irgendwie eine Kopie der ersten Frage - mit einigen bootstrap-Elementen - gezeigt.
 
Man kann natürlich das Ergebnis der ersten Frage auch einfach verbalisieren, wie darunter.

Und bei der dritten Frage geht es dann analog.

Es könnte also zum Beispiel so aussehen (hier mit vanilla theme).
 
Joffm

 

Volunteers are not paid.
Not because they are worthless, but because they are priceless
Last edit: 1 week 2 days ago by Joffm.

Please Log in to join the conversation.

  • BernadetteSchorn
  • BernadetteSchorn's Avatar Topic Author
  • Offline
  • New Member
  • New Member
More
1 week 2 days ago #269966 by BernadetteSchorn
Hallo Joffm,

das sieht genau so aus, wie es sein soll!
Hast du eine .lss-Datei, die zeigt, wie du das technisch umgesetzt hast?

Vielen Dank für deine tolle Hilfe und viele Grüße
Bernadette

Please Log in to join the conversation.

  • Joffm
  • Joffm's Avatar
  • Offline
  • LimeSurvey Community Team
  • LimeSurvey Community Team
More
1 week 2 days ago #269968 by Joffm
Hallo, Bernadette,
wie ich bereits schrieb: Du solltest den lss Export eines kleinen Prototypen (3-4 Gruppen mit den jeweiligen Fragen) senden.
Dann habe ich realistisches Material und kann auch etwas Vernünftiges einbauen.

Das Ganze beruht ja einfach auf einem bisschen HTML mit bootstrap-Elementen.
Ich habe hier eine bzw. zwei "card"-Elemente genommen und darin "disabled radios"
[url] getbootstrap.com/docs/5.3/forms/checks-radios/#disabled-1 [/url]

Das kann man / muss man natürlich anders gestaltem je nach Fragetyp.

Daher: Her mit Deiner lss.

Bis dann
Joffm 

Volunteers are not paid.
Not because they are worthless, but because they are priceless

Please Log in to join the conversation.

  • BernadetteSchorn
  • BernadetteSchorn's Avatar Topic Author
  • Offline
  • New Member
  • New Member
More
1 week 2 days ago #269990 by BernadetteSchorn
Hallo Joffm,

hier meine .lss zum Testen.
Vielen Dank schon mal!

Please Log in to join the conversation.

  • Joffm
  • Joffm's Avatar
  • Offline
  • LimeSurvey Community Team
  • LimeSurvey Community Team
More
1 week 1 day ago #270004 by Joffm
Ich werde mich gleich morgen früh daran machen.
Heute musste ich ein wenig im Garten arbeiten.

Joffm 

Volunteers are not paid.
Not because they are worthless, but because they are priceless

Please Log in to join the conversation.

  • Joffm
  • Joffm's Avatar
  • Offline
  • LimeSurvey Community Team
  • LimeSurvey Community Team
More
1 week 1 day ago - 1 week 1 day ago #270017 by Joffm
So, hier kommt mein erster Vorschlag.
In die jeweils zweite Frage wird (im Quellcode-Modus) dies eingefügt
Code:
<div class="container">
  <div class="row">
    <div class="col-md-4">
        <p><img alt="" src="https://upload.wikimedia.org/wikipedia/commons/thumb/e/ea/Grasende_Fjordpferde.jpg/960px-Grasende_Fjordpferde.jpg" style="width:80%"/></p>
    </div>
    <div class="col-md-8">
      <div class="well well-sm">
        <h5><b>Welches Tier ist auf dem Foto abgebildet?</b></h5>
        <div class="form-check">
          <input class="form-check-input" type="radio" name="r11" {if(Q10==1,'checked','')} disabled>
          <label class="form-check-label">Pferd</label>
        </div>
        <div class="form-check">
          <input class="form-check-input" type="radio" name="r12" {if(Q10==2,'checked','')} disabled>
          <label class="form-check-label">Hund</label>
        </div>
        <div class="form-check">
          <input class="form-check-input" type="radio" name="r13" {if(Q10==3,'checked','')} disabled>
          <label class="form-check-label">Maus</label>
        </div>
        <div class="form-check">
          <input class="form-check-input" type="radio" name="r14" {if(Q10==4,'checked','')} disabled>
          <label class="form-check-label">Regenwurm</label>
        </div>
      </div>
    </div>
  </div>
</div>

Anzupassen sind
  • das Bild
  • der Fragecode der vorherigen Frage ( {if(Q10==1,'checked','')} )
  • die dort vorhandenen Antwortoptionen ( <label class="form-check-label">Maus</label> )
Und in der dritten Frage taucht dieser Teil natürlich wieder auf und zusätzlich die Anzeige der zweiten Frage
Code:
<div class="container">
  <div class="row">
    <div class="col-md-4">
        <p><img alt="" src="https://upload.wikimedia.org/wikipedia/commons/thumb/e/ea/Grasende_Fjordpferde.jpg/960px-Grasende_Fjordpferde.jpg" style="width:80%"/></p>
    </div>
    <div class="col-md-8">
      <div class="well well-sm">
        <h5><b>Welches Tier ist auf dem Foto abgebildet?</b></h5>
        <div class="form-check">
          <input class="form-check-input" type="radio" name="r11" {if(Q10==1,'checked','')} disabled>
          <label class="form-check-label">Pferd</label>
        </div>
        <div class="form-check">
          <input class="form-check-input" type="radio" name="r12" {if(Q10==2,'checked','')} disabled>
          <label class="form-check-label">Hund</label>
        </div>
        <div class="form-check">
          <input class="form-check-input" type="radio" name="r13" {if(Q10==3,'checked','')} disabled>
          <label class="form-check-label">Maus</label>
        </div>
        <div class="form-check">
          <input class="form-check-input" type="radio" name="r14" {if(Q10==4,'checked','')} disabled>
          <label class="form-check-label">Regenwurm</label>
        </div>
      </div>
    </div>
  </div>
 
  <div class="row">
    <div class="col-md-8  offset-md-4">
      <div class="well well-sm">
        <h5><b>Wie sicher sind Sie sich bei Ihrer Antwort?</b></h5>
        <div class="form-check">
          <input class="form-check-input" type="radio" name="r21" {if(Q11_SQ001==1,'checked','')} disabled>
          <label class="form-check-label">1 = völlig unsicher</label>
        </div>
        <div class="form-check">
          <input class="form-check-input" type="radio" name="r22" {if(Q11_SQ001==2,'checked','')} disabled>
          <label class="form-check-label">2</label>
        </div>
        <div class="form-check">
          <input class="form-check-input" type="radio" name="r23" {if(Q11_SQ001==3,'checked','')} disabled>
          <label class="form-check-label">3</label>
        </div>
        <div class="form-check">
          <input class="form-check-input" type="radio" name="r24" {if(Q11_SQ001==4,'checked','')} disabled>
          <label class="form-check-label">4</label>
        </div>
        <div class="form-check">
          <input class="form-check-input" type="radio" name="r25" {if(Q11_SQ001==5,'checked','')} disabled>
          <label class="form-check-label">5</label>
        </div>
        <div class="form-check">
          <input class="form-check-input" type="radio" name="r26" {if(Q11_SQ001==6,'checked','')} disabled>
          <label class="form-check-label">6 = völlig sicher</label>
        </div>
      </div>
    </div>
  </div>
</div>


Außer den im ersten Teil anzupassenden Teile kommt hier nur noch der Fragencode der zweiten Frage hinzu ({if(Q11_SQ001==6,'checked','')})
Ich würde in einem Text-Editor das Gerüst erstellen, dort die notwendigen Anpassungen machen, und dann immer in die entsprechende Frage kopieren.

Außerdem - Du hast es vielleicht schon gesehen - habe ich die Codes der Antwortoptionen von diesem "AO01", "AO02", ... in numerische Codes 1,2,3,... geändert.
Wichtigster Grund: Du hast in der zweiten Frage eine Skala. Sicherlich möchtest Du damit einmal statistische Tests rechnen, z.B. t-Test, um zu sehen, ob sich Gruppen unterscheiden.
Dazu benötigst Da aber numerische Werte - der Mittelwert von "AO01" und "AO04" ist wirklich nicht "AO02,5"

Außerdem sind numerische Werte leichter zu handhaben.
"AO01" ist ein Text; daher muss er immer in Anführungszeichen eingeschlossen werden.
Heißt:
Ein Bedingung sieht dann so aus: Q1=="AO03"
Oder wenn ich nur die ersten drei Optionen als Filter für die nächste Frage benutzen will: Q1=="AO01" OR Q1=="AO02" OR Q1=="AO03"
Einfacher ist dann schon ein Q1<4

Das bringt mich zum nächsten.
Du hattest z.B. als Bedingung eingetragen "Q11".
Dies ist aber nicht korrekt. Diese Bedingung ist ein logischer Term, der entweder WAHR oder FALSCH ist.
Wenn WAHR, wird die Teilfrage / Frage / Gruppe angezeigt, wenn FALSCH eben nicht.
Z.B. Q1==4: Wenn die Frage Q1 mit dem Code 4 beantwortet wurde, ist der Term WAHR, ansonsten nicht.
Q1_SQ001=="Y" AND Q2>3: Wenn die Teilfrage SQ001 der Frage Q1 angeklickt wurde UND der Antwortcode der Frage Q2 größer als 3 ist, ist diese Bedingung WAHR.

Bei Dir hat es zufälligerweise funktioniert, da hier einfach gestest wird, ob die Frage beantwortet wurde, was korrekterweise mit "!is_empty(Q1)" geschehen sollte.

Nun noch zu diesem Satz

Die 20 Item sollen untereinander in festgelegten Gruppen randomisiert sein.

Soll das heißen, es gibt beispielsweise 4 Untergruppen zu je 5 Items?
Und zunächst werden die 5 Items der Untergruppe 1 in randomisierter Reihenfolge gestellt, dann die 5 Items der Untergruppe 2,...?
Dazu musst Du sie ja nur in unterschiedliche Randomisierungsgruppen legen.
Wenn dies aber bedeuten soll, dass die 4 Untergruppen in unterschiedlicher Reihenfolge angezeigt werden sollen, und zusätzlich die Items innerhalb jeder Untergruppe ebenfalls - dann musst Du Dir ein neues Design ausdenken


Als Letztes:
In der dritten Frage zeige ich die vorherigen untereinander an.
Ich werde mich später noch an einer Lösung mit den beiden Fragen nebeneinander versuchen.

Auch dieses kann man noch verbessern (siehe Heisenberg)

 

File Attachment:

File Name: limesurvey...75_J.lss
File Size:117 KB

 
Bis dann
Joffm

P.S. Da der HTML-Editor manchmal etwas "spinnt", d.h. eigene Ideen hat, solltest Du hierfür den Quellcode-Editor benutzen.
Diesen schaltest Du ein, indEm Du in Dein Konto gehst (oben rechts) und dann in "Persönliche Einstellungen".
 

Volunteers are not paid.
Not because they are worthless, but because they are priceless
Last edit: 1 week 1 day ago by Joffm.

Please Log in to join the conversation.

  • Joffm
  • Joffm's Avatar
  • Offline
  • LimeSurvey Community Team
  • LimeSurvey Community Team
More
1 week 1 day ago #270025 by Joffm
Wie angekündigt ein m.E. etwas schöneres Layout.


Und ist auch gut auf einem Smartphone zu sehen.


Hier die lss.
 

File Attachment:

File Name: limesurvey...6_J2.lss
File Size:117 KB

Die "neuen" dritten Fragen haben alle den Zusatz "a".
Allerdings habe ich auch in den zweiten Fragen dem Bild die Klasse "img-fluid" spendiert, damit es responsiv ist; dafür fällt die "width" weg.

Joffm

P.S.
Dies alles ist natürlich auch abhängig vom benutzten Theme.
Hier habe ich einmal das Standard-Theme  "fruity"  benutzt.
In "fruity-twentythree" sieht es so aus.
 
Hier sollte man noch etwas an den Schriftgrößen drehen; und wie man sieht, hat die Klasse "well" keinen Hintergrund und keinen Rahmen.
Falls gewünscht, eben mit css wieder hinzufügen.



 

Volunteers are not paid.
Not because they are worthless, but because they are priceless

Please Log in to join the conversation.

  • BernadetteSchorn
  • BernadetteSchorn's Avatar Topic Author
  • Offline
  • New Member
  • New Member
More
1 week 22 hours ago #270026 by BernadetteSchorn
Lieber Joffm,
super, vielen vielen Dank für Deine Hilfe und die testweise Umsetzung!
So komme ich jetzt zurecht und wenn es noch mal hakt, melde ich mich wieder bei Dir ;-)

Eine Frage ich sofort noch: Wo finde ich die Dokumentation zu den verfügbaren CSS-Klassen?

Viele Grüße und einen schönen Abend, 
Bernadette

Please Log in to join the conversation.

  • Joffm
  • Joffm's Avatar
  • Offline
  • LimeSurvey Community Team
  • LimeSurvey Community Team
More
1 week 10 hours ago #270029 by Joffm
Hallo, Bernadette,

Ich weiß nicht genau, was Du meinst.
Allgemein LimeSurvey?
Dazu benutzt Du das Webdevelopment-Tool des Browsers (F12) und untersuchst die Seite.
Du kannst hier schon Dinge ändern, hinzufügen oder löschen, um den Effekt zu sehen.
Wenn dann alles passt übernimmst Du dies (je nachdem) in Deine Frage oder in die "custom.css" des erweiterten Themes.

Oder meine kleine Erweiterung.
LimeSurvey in der Version 6 beruht auf bootstrap 5.
Daher findest Du alls darüber hier
[url] getbootstrap.com/docs/5.3/getting-started/introduction/ [/url]

Joffm

Volunteers are not paid.
Not because they are worthless, but because they are priceless

Please Log in to join the conversation.

Moderators: holchJoffmtpartner

Lime-years ahead

Online-surveys for every purse and purpose