Hi Jeremy,
I added a TextInput (for age) to the demographics page of my experiment, restricted it to two characters and managed to add an error message if left empty. Now there are a few issues, though:
1. None of the error messages on the page (including the ones of the DropDowns I had before) will disappear once options are selected / the TextInput is filled.
2. The continue (“Weiter”) button doesn’t work anymore.
3. I am also unsure where to add the restriction of numerical values for age to the TextInput.
Here is the code:
(I’m unsure about .wait(“first”) at the end – I actually prefer participants having to click continue once everything has been filled out, so I might change that still).
//// DEMOGRAPHICS ==============================================================
PennController("demographics",
newText("DemographicsText", "<p>Bevor es losgeht, brauchen wir einige Angaben zu Deiner Person. Diese werden anonymisiert gespeichert und eine spätere Zuordnung zu Dir wird nicht möglich sein. Bitte nimm Dir beim Ausfüllen der Felder Zeit.<p>")
.settings.css("font-family","times new roman") .settings.css("font-size", "18px")
.settings.italic()
,
newCanvas("infocanvas", 1000, 70)
.settings.add(0, 0, getText("DemographicsText") )
.print()
,
newTextInput("age")
.settings.length(2)
.settings.log()
,
newText("Alter", "1. Alter:")
.settings.css("font-family","times new roman") .settings.css("font-size", "18px")
.settings.bold()
,
newCanvas("agecanvas", 1000, 45)
.settings.add(0,10, getText("Alter"))
.settings.add(80,8, getTextInput("age"))
.settings.log()
.print()
,
///
newText("Geschlecht", "2. Geschlecht: ")
.settings.css("font-family","times new roman") .settings.css("font-size", "18px")
.settings.bold()
,
newDropDown("sex","")
.settings.add("Weiblich","Männlich", "Divers")
.settings.log()
,
newCanvas("sexcanvas", 1000, 40)
.settings.add(0,0, getText("Geschlecht"))
.settings.add(120,3, getDropDown("sex"))
.print()
,
///
newText("Muttersprache", "3. Ist Deutsch Deine Muttersprache?")
.settings.css("font-family","times new roman") .settings.css("font-size", "18px")
.settings.bold()
,
newDropDown("german", "")
.settings.add("Ja", "Nein")
.settings.log()
,
newCanvas("Nativelangcanvas", 1000, 40)
.settings.add(0,0, getText("Muttersprache"))
.settings.add(295,3, getDropDown("german"))
.print()
,
///
newText("Nationality", "4. Was ist Deine Nationalität?")
.settings.css("font-family","times new roman") .settings.css("font-size", "18px")
.settings.bold()
,
newDropDown("nationality", "")
.settings.add("Deutschland","Österreich", "Schweiz", "Italien", "Andere")
.settings.log()
,
newCanvas("nationalcanvas", 1000, 40)
.settings.add(0,0, getText("Nationality"))
.settings.add(240,2, getDropDown("nationality"))
.print()
,
///
newText("Bildungsabschluss", "5. Was ist Dein höchster Bildungsabschluss?")
.settings.css("font-family","times new roman") .settings.css("font-size", "18px")
.settings.bold()
,
newDropDown("bildung", "")
.settings.add("(Pflicht-)Schulabschluss","Abitur / Matura oder gleichwertiger Abschluss", "Hochschulabschluss", "Ausbildung", "Sonstige")
.settings.log()
,
newCanvas("bildungcanvas", 1000, 40)
.settings.add(0,0, getText("Bildungsabschluss"))
.settings.add(350,2, getDropDown("bildung"))
.print()
,
///
newText("Hauptbeschäftigung", "6. Was ist Deine derzeitige Hauptbeschäftigung?")
.settings.css("font-family","times new roman") .settings.css("font-size", "18px")
.settings.bold()
,
newDropDown("job", "")
.settings.add("Keine","Studium","Anstellung", "Selbstständigkeit", "Sonstige")
.settings.log()
,
newCanvas("jobcanvas", 1000, 40)
.settings.add(0,0, getText("Hauptbeschäftigung"))
.settings.add(380,2, getDropDown("job"))
.print()
,
///
newButton("okay", "Weiter")
.print()
.wait()
,
getTextInput("age")
.test.text(/[^\s]/)
.failure(
newText("Bitte gib Dein Alter an.")
.settings.color("red")
.print())
,
getDropDown("sex")
.test.selected()
.success()
.failure(
newText("Bitte gib Dein Geschlecht an.")
.settings.color("red")
.print())
,
getDropDown("german")
.test.selected()
.success()
.failure(
newText("Bitte gib an, ob Deutsch Deine Muttersprache ist.")
.settings.color("red")
.print())
,
getDropDown("nationality")
.test.selected()
.success()
.failure(
newText("Bitte gib Deine Nationalität an.")
.settings.color("red")
.print())
,
getDropDown("bildung")
.test.selected()
.success()
.failure(
newText("Bitte gib Deinen Bildungsstand an.")
.settings.color("red")
.print())
,
getDropDown("job")
.test.selected()
.success()
.failure(
newText("Bitte gib Deine Hauptbeschäftigung an.")
.settings.color("red")
.print())
,
getTextInput("age").wait("first")
,
getDropDown("sex").wait("first")
,
getDropDown("german").wait("first")
,
getDropDown("nationality").wait("first")
,
getDropDown("bildung").wait("first")
,
getDropDown("job").wait("first")
,
getButton("okay")
.print()
)
Sorry it’s a bit long! Thanks for your help in advance.
Best,
Kathy
