Mandatory Fields & Next Button

Comments

• Fab

  April 2023 edited April 2023

  Hi @anna_st,

  I'm not experienced with this, but you can achieve it by using the inline_html object (information on how to use it here: https://osdoc.cogsci.nl/3.3/manual/forms/html/ and searching the internet for information about HTML forms).

  

  In that form, type something like:

  <textarea name='response' rows='10' cols='50'></textarea>
  <input type='submit' value='submit'>
  

  This creates a text box with 10 rows and 50 columns, and a button that says "submit".

  The participant will be able to type text in that box, including pressing ENTER, and the response will only be taken once the "Submit" button is pressed.

  Note taht by naming the textarea "response", I'm actually defining the variable from which you can then retrieve the response. To illustrate it, you can insert a feedback object right after and set it up as follows:

  

  You can edit the form in anyway you like (just look up for information on HTML forms).

  I attach a small example:

  Takemultiplelinesoftextinform.osexp

  Note that HTML forms will only work if you run your task in a browser (I assume you are, since you posted this in the OSWeb forum).

  Hope this helps!

  Fabrice.

  
• anna_st

  April 2023

  Hello @Fab,

  thank you so much for your response! This has helped me a lot.

  Is there a similar code for the form_base function for when the experiment is conducted in person/offline?

  And do you have an idea what code I could use, so that participants cannot skip any questions before actually replying to them?

  Have a great weekend!

  Anna
• Fab

  April 2023

  Hi @anna_st,

  If you don't want participants to skip a response without providing some response, you should place the form insde a seuqence inside a loop, set the loop to repeat say 10 times, and set a "break if" condition so that the loop is interrupted when a response has been produced. For this, you need to use code in Javascript to detect when a response has been detected, then set a specific variable to a certain value that you then test in the "break if" condition. If you have several questions in your task, you'll need to reset that variable between questions.

  

  

  That will still allow participants to juste press the space bar once as an asnwer, though. If you want to use a more demanding check, you can do so developping the code as you see fit.

  Second, concerning running the task in the browser offline. Running in the experiment in the browser is geared toward running it on a server (e.g., in connection witrh JATOS) for the data to be handled. Running it through the browser from OS will run the task but it will not save the data. So, to save the data, you have to write some code in Javascript that will do so. Here is one way to do so:

  At the beginning of the experiment, we set the following variables:

  // The array to store the participant responses
  vars.participantResponses = [];
  vars.collected="no";
  

  Right after a form, we need to collect the response and append it to previously collected data (you'll need to go through the ode and adapt it dpeending on your needs, as you'd need to use this type of code after any response collection if you want to include it in the data saved at the end).

  // Function to add a new response object to the participantResponses array
  function appendResponse(responseObj) {
  vars.participantResponses.push(responseObj);
  }
  
  
  // Replace this with the actual data collected during the trial
  const trialData = { id: 1, subject: vars.subject_nr, response: vars.response, reactionTime: vars.response_time};
  
  // Add the trial data to the participantResponses array
  if (vars.response!="") {
  appendResponse(trialData);
  vars.collected="yes"
  }
  

  At the end of the experiment, you'll need to include some code saveing the data into a text file (the task will prompt the user to indicate where the file should be saved).

  // Function to save CSV data as a local file
  
  function arrayToCSV(data) {
  const header = Object.keys(data[0]).join(",");
  const csvRows = data.map((row) => Object.values(row).join(","));
  const csvContent = [header, ...csvRows].join("\n");
  return csvContent;
  }
  
  function saveCSVFile(data, filename = "participant"+vars.subject_nr+"_data.csv") {
  const csvData = arrayToCSV(data);
  const csvBlob = new Blob([csvData], { type: "text/csv;charset=utf-8;" });
  const a = document.createElement("a");
  const url = URL.createObjectURL(csvBlob);
  
  a.href = url;
  a.download = filename;
  a.style.display = "none";
  document.body.appendChild(a);
  a.click();
  setTimeout(() => {
  document.body.removeChild(a);
  window.URL.revokeObjectURL(url);
  }, 100);
  }
  // Save the participantResponses array as a CSV file
  saveCSVFile(vars.participantResponses);
  

  I include an example with two form questions:

  Takemultiplelinesoftextinform v2.osexp

  I don't recommend running the experiment through the browser in the lab unless really necessary, and the code above may, depending on how many trials you're using and the nature of your tas, slow things down and consume memory. OSWeb is really designed to work with some server solution (e.g., JATOS).

  Have a look at the example and adapt the code as you require (Javascript is a language of its own, independent from Open Sesame, so each user should edit based on their needs and goals).

  Hope this helps.

  Fabrice.