Online experiment with showing picture + having a type box

sotake24

Hello,

I'm trying to design the recall phase of my experiment, where participants view a picture, and they have to type in the word that was paired with the picture (This is after they learned the word-picture pairs).

The issue is, I do understand on osweb you cannot have the form_base item (which I initially tried to use and succeeded on desktop). I think in theory you'd need a inline javascript item with the picture embedded there, and a text input box below it. In my datafile, I only need to record the displayed picture, and what the participant typed (so no feedback).

Is there a way to do this? Javascript is a little beyond me so any help would be much appreciated.

sebastiaan

Hi @sotake24 ,

If I understand correctly you want to show a form that shows an image, presumably defined by a variable, and that also collects a text-input response from the participant. And you want to do that in OSWeb. Is that correct?

If so, you can use the inline_html item along the lines shown below. Essentially, the idea is to add some JavaScript that retrieves an image from the file pool based on a variable my_image (which should be defined somewhere, typically in a loop ) and then assigns it to an HTML img element.

<input type='text' name='text_response'>
<img id='my_image_element'>
<input type='submit' value='ok'>

<script>
document.getElementById('my_image_element').src = pool[my_image].data.src
</script>

See also:

• https://osdoc.cogsci.nl/4.0/manual/forms/html/

Is that helpful?

— Sebastiaan

Fab

Hi @sotake24,

The form_base is indeed not currently supported in OSWeb. However, you can use the inline_javascript or the inline_html to achieve the same result.

A simple way to show a picture and take a response frmo the participant is to use the html_inline and write your own html code (see https://osdoc.cogsci.nl/4.0/manual/forms/html/ for hints). Note that you can also insert some javascript scrtipting into the html document, which makskes it quite flexible. There are many resources out there if you're not familiar with html and javascript.

I put an example together where the picture is taken from a variable in a loop.

Note that the name property in input type='text' name='text_response' defines the variable in which the participant's response is stored. I added a feedback object to ilustrate it.

Show_pic_take_text.osexp

Hope this helps,

Fabrice.

sotake24

Dear @sebastiaan and @Fab

Thank you so much for your help.

It seems to have gotten me what I wanted!

-sotake24