This commit is contained in:
Becky Gilbert 2020-10-02 11:36:27 -07:00
commit c1dc2295ad
2 changed files with 26 additions and 2 deletions

View File

@ -16,8 +16,15 @@
html: '<p> I am feeling <input name="first" type="text" />, <input name="second" type="text" />, and <input name="third" type="text" />.</p>' html: '<p> I am feeling <input name="first" type="text" />, <input name="second" type="text" />, and <input name="third" type="text" />.</p>'
} }
var autofocus_trial = {
type: 'survey-html-form',
preamble: '<p> What is your favorite bird?</p>',
html: '<p>MY favorite bird is <input type="text" id="test-resp-box" name="response" size="10" /></p>',
autofocus: 'test-resp-box'
}
jsPsych.init({ jsPsych.init({
timeline: [form_trial], timeline: [form_trial,autofocus_trial],
on_finish: function(){ jsPsych.data.displayData(); } on_finish: function(){ jsPsych.data.displayData(); }
}); });

View File

@ -34,6 +34,12 @@ jsPsych.plugins['survey-html-form'] = (function() {
default: 'Continue', default: 'Continue',
description: 'The text that appears on the button to finish the trial.' description: 'The text that appears on the button to finish the trial.'
}, },
autofocus: {
type: jsPsych.plugins.parameterType.STRING,
pretty_name: 'Element ID to focus',
default: '',
description: 'The HTML element ID of a form field to autofocus on.'
},
dataAsArray: { dataAsArray: {
type: jsPsych.plugins.parameterType.BOOLEAN, type: jsPsych.plugins.parameterType.BOOLEAN,
pretty_name: 'Data As Array', pretty_name: 'Data As Array',
@ -69,9 +75,20 @@ jsPsych.plugins['survey-html-form'] = (function() {
// add submit button // add submit button
html += '<input type="submit" id="jspsych-survey-html-form-next" class="jspsych-btn jspsych-survey-html-form" value="'+trial.button_label+'"></input>'; html += '<input type="submit" id="jspsych-survey-html-form-next" class="jspsych-btn jspsych-survey-html-form" value="'+trial.button_label+'"></input>';
html += '</form>' html += '</form>';
display_element.innerHTML = html; display_element.innerHTML = html;
if ( trial.autofocus !== '' ) {
var focus_elements = display_element.querySelectorAll('#'+trial.autofocus);
if ( focus_elements.length === 0 ) {
console.warn('No element found with id: '+trial.autofocus);
} else if ( focus_elements.length > 1 ) {
console.warn('The id "'+trial.autofocus+'" is not unique so autofocus will not work.')
} else {
focus_elements[0].focus()
}
}
display_element.querySelector('#jspsych-survey-html-form').addEventListener('submit', function(event) { display_element.querySelector('#jspsych-survey-html-form').addEventListener('submit', function(event) {
// don't submit form // don't submit form
event.preventDefault(); event.preventDefault();