mirror of
https://github.com/jspsych/jsPsych.git
synced 2025-05-10 11:10:54 +00:00
some minor tweaks to survey-html-form plugin
This commit is contained in:
Josh de Leeuw
parent
7d01510a24
commit
208ecf0365
@ -19,7 +19,7 @@ In addition to the [default data collected by all plugins](overview#datacollecte
|
||||
|
||||
Name | Type | Value
|
||||
-----|------|------
|
||||
responses | Object | A JS object containing the response for each input. The encoded object will have a separate variable for the response to each input, with each variable being named after its corresponding input element. Each response is a string containing whatever the subject answered for this particular input.
|
||||
responses | string | A JS object encoded in JSON format containing the response for each input. The encoded object will have a separate variable for the response to each input, with each variable being named after its corresponding input element. Each response is a string containing whatever the subject answered for this particular input.
|
||||
rt | numeric | The response time in milliseconds for the subject to make a response.
|
||||
|
||||
## Examples
|
||||
|
||||
@ -1,33 +1,23 @@
|
||||
<!DOCTYPE html>
|
||||
<html>
|
||||
<link rel="stylesheet" href="https://fonts.googleapis.com/icon?family=Material+Icons">
|
||||
<link rel="stylesheet" href="https://code.getmdl.io/1.2.1/material.indigo-pink.min.css">
|
||||
<script defer src="https://code.getmdl.io/1.2.1/material.min.js"></script>
|
||||
<script src="../jspsych.js"></script>
|
||||
<script src="../plugins/jspsych-survey-html-form.js"></script>
|
||||
<script src="../plugins/jspsych-html-keyboard-response.js"></script>
|
||||
<link rel="stylesheet" href="../css/jspsych.css"></script>
|
||||
|
||||
<head>
|
||||
<title></title>
|
||||
<script src="../jspsych.js"></script>
|
||||
<script src="../plugins/jspsych-survey-html-form.js"></script>
|
||||
<link rel="stylesheet" href="../css/jspsych.css"></script>
|
||||
</head>
|
||||
<body>
|
||||
|
||||
</body>
|
||||
<script type="text/javascript">
|
||||
var text_trial = {
|
||||
type: 'html-keyboard-response',
|
||||
stimulus: 'Press any key to view form.'
|
||||
}
|
||||
|
||||
var form_trial = {
|
||||
type: 'survey-html-form',
|
||||
preamble: '<p> How are you feeling <b>right now?</b> </p>',
|
||||
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>'
|
||||
}
|
||||
|
||||
jsPsych.init({
|
||||
timeline: [text_trial, form_trial],
|
||||
timeline: [form_trial],
|
||||
on_finish: function(){ jsPsych.data.displayData(); }
|
||||
});
|
||||
|
||||
|
||||
@ -8,59 +8,8 @@
|
||||
*
|
||||
*/
|
||||
|
||||
|
||||
jsPsych.plugins['survey-html-form'] = (function() {
|
||||
|
||||
/*!
|
||||
* Serialize all form data into an array
|
||||
* (c) 2018 Chris Ferdinandi, MIT License, https://gomakethings.com
|
||||
* @param {Node} form The form to serialize
|
||||
* @return {String} The serialized form data
|
||||
*/
|
||||
var serializeArray = function (form) {
|
||||
// Setup our serialized data
|
||||
var serialized = [];
|
||||
|
||||
// Loop through each field in the form
|
||||
for (var i = 0; i < form.elements.length; i++) {
|
||||
var field = form.elements[i];
|
||||
|
||||
// Don't serialize fields without a name, submits, buttons, file and reset inputs, and disabled fields
|
||||
if (!field.name || field.disabled || field.type === 'file' || field.type === 'reset' || field.type === 'submit' || field.type === 'button') continue;
|
||||
|
||||
// If a multi-select, get all selections
|
||||
if (field.type === 'select-multiple') {
|
||||
for (var n = 0; n < field.options.length; n++) {
|
||||
if (!field.options[n].selected) continue;
|
||||
serialized.push({
|
||||
name: field.name,
|
||||
value: field.options[n].value
|
||||
});
|
||||
}
|
||||
}
|
||||
|
||||
// Convert field data to a query string
|
||||
else if ((field.type !== 'checkbox' && field.type !== 'radio') || field.checked) {
|
||||
serialized.push({
|
||||
name: field.name,
|
||||
value: field.value
|
||||
});
|
||||
}
|
||||
}
|
||||
|
||||
return serialized;
|
||||
};
|
||||
|
||||
// from https://stackoverflow.com/questions/1184624/convert-form-data-to-javascript-object-with-jquery
|
||||
function objectifyForm(formArray) {//serialize data function
|
||||
var returnArray = {};
|
||||
for (var i = 0; i < formArray.length; i++){
|
||||
returnArray[formArray[i]['name']] = formArray[i]['value'];
|
||||
}
|
||||
return returnArray;
|
||||
}
|
||||
|
||||
|
||||
var plugin = {};
|
||||
|
||||
plugin.info = {
|
||||
@ -130,7 +79,7 @@ jsPsych.plugins['survey-html-form'] = (function() {
|
||||
// save data
|
||||
var trialdata = {
|
||||
"rt": response_time,
|
||||
"responses": question_data
|
||||
"responses": JSON.stringify(question_data);
|
||||
};
|
||||
|
||||
display_element.innerHTML = '';
|
||||
@ -142,5 +91,54 @@ jsPsych.plugins['survey-html-form'] = (function() {
|
||||
var startTime = performance.now();
|
||||
};
|
||||
|
||||
/*!
|
||||
* Serialize all form data into an array
|
||||
* (c) 2018 Chris Ferdinandi, MIT License, https://gomakethings.com
|
||||
* @param {Node} form The form to serialize
|
||||
* @return {String} The serialized form data
|
||||
*/
|
||||
var serializeArray = function (form) {
|
||||
// Setup our serialized data
|
||||
var serialized = [];
|
||||
|
||||
// Loop through each field in the form
|
||||
for (var i = 0; i < form.elements.length; i++) {
|
||||
var field = form.elements[i];
|
||||
|
||||
// Don't serialize fields without a name, submits, buttons, file and reset inputs, and disabled fields
|
||||
if (!field.name || field.disabled || field.type === 'file' || field.type === 'reset' || field.type === 'submit' || field.type === 'button') continue;
|
||||
|
||||
// If a multi-select, get all selections
|
||||
if (field.type === 'select-multiple') {
|
||||
for (var n = 0; n < field.options.length; n++) {
|
||||
if (!field.options[n].selected) continue;
|
||||
serialized.push({
|
||||
name: field.name,
|
||||
value: field.options[n].value
|
||||
});
|
||||
}
|
||||
}
|
||||
|
||||
// Convert field data to a query string
|
||||
else if ((field.type !== 'checkbox' && field.type !== 'radio') || field.checked) {
|
||||
serialized.push({
|
||||
name: field.name,
|
||||
value: field.value
|
||||
});
|
||||
}
|
||||
}
|
||||
|
||||
return serialized;
|
||||
};
|
||||
|
||||
// from https://stackoverflow.com/questions/1184624/convert-form-data-to-javascript-object-with-jquery
|
||||
function objectifyForm(formArray) {//serialize data function
|
||||
var returnArray = {};
|
||||
for (var i = 0; i < formArray.length; i++){
|
||||
returnArray[formArray[i]['name']] = formArray[i]['value'];
|
||||
}
|
||||
return returnArray;
|
||||
}
|
||||
|
||||
return plugin;
|
||||
})();
|
||||
|
||||
Loading…
Reference in New Issue
Block a user