Welcome to the LimeSurvey Community Forum

Ask the community, share ideas, and connect with other LimeSurvey users!

Evaluative Space Grid - once again...

jesterstear
Topic Author
Offline
New Member

More

13 years 1 month ago - 13 years 1 month ago #57886 by jesterstear

Evaluative Space Grid - once again... was created by jesterstear

I've already posted this a year ago, but I cannot find it anymore in this forum. There is still no solution to the following problem:

Is there any possibility to include an evaluative space grid?

The evaluative space grid (ESG) is a two-dimensional grid that
provides a single-item measure of positivity and negativity (Larsen et al, 2009) [for a picture and further instructions see p.4]

Of course, it is possible to label the x-axis and the y-axis with different label sets. For instance, valence (very bad to very good) is represented on the x-axis, whereas importance (not important at all/very unimportant to very important) is represented on the y-axis.

However, if there are 5x5 radiobuttons, you shouldn't be able to check one in each column; only 1 of 25 radiobuttons should be allowed to become checked. I guess this can be done by javascript. Does anybody know a solution?

Thanks,
Jester.

Last edit: 13 years 1 month ago by jesterstear.

The topic has been locked.

gribouts
Offline
New Member

More

12 years 7 months ago #65480 by gribouts

Replied by gribouts on topic Evaluative Space Grid - once again...

heya, would be really interested in using such a measure as well. I'd say we could do the grid in flash but the problem would be to record the answer in a database imho and for this, I have no clue...

This type of thing ( seawitchery.tumblr.com/post/4070384205 ) could be a good base for the coding as well I'd guess (eventhough I really suck in coding and thus, I may be wrong). Grib.

The topic has been locked.

holch
Offline
LimeSurvey Community Team

More

12 years 7 months ago - 12 years 7 months ago #65487 by holch

Replied by holch on topic Evaluative Space Grid - once again...

What I find strange is the scales. Positive and negative at the same time.

Wouldn't it be weird if someone rates "extremely negative" AND "extremely positive" at the same time (upper right corner). Wouldn't that be a [strike]contraction[/strike] [how I love spell checks] contradiction? (didn't have time to read the whole theory behind it.

However, for other cases I think this would be a nice thing.

It should be possible with javascript though. You could include a image and measure with javascript where the respondent clicked, pass this on into a hidden text field. I am not an expert on Javascript, but this should be possible.

I answer at the LimeSurvey forum in my spare time, I'm not a LimeSurvey GmbH employee.
No support via private message.

Last edit: 12 years 7 months ago by holch.

The topic has been locked.

tpartner
Offline
LimeSurvey Community Team

More

12 years 7 months ago #65502 by tpartner

Replied by tpartner on topic Evaluative Space Grid - once again...

You could do it with a simple array (radios) and a little JavaScript.

See this post - www.limesurvey.org/en/forum/can-i-do-thi...forcing-a-rank#59543

Cheers,
Tony Partner
Solutions, code and workarounds presented in these forums are given without any warranty, implied or otherwise.

The topic has been locked.

gribouts
Offline
New Member

More

12 years 7 months ago #65505 by gribouts

Replied by gribouts on topic Evaluative Space Grid - once again...

gonna check it tomorrow, would be cool to find a way to make it work. Thanks for your comments guys

The topic has been locked.

tpartner
Offline
LimeSurvey Community Team

More

12 years 7 months ago - 12 years 7 months ago #65514 by tpartner

Replied by tpartner on topic Evaluative Space Grid - once again...

Here's a simple script to allow only one radio in an Array question to be checked. Replace "QQ" with the array question ID .

Code:

<script type="text/javascript" charset="utf-8">
 
  $(document).ready(function() {
 
    var qID = QQ;
 
    // Listener on radio buttons to allow only one checked
    $('#question'+qID+' .question input.radio').click(function(){
 
      $('#question'+qID+' input.radio:checked').attr('checked', false);
    });
 
    // Listener on radio cells to allow only one checked
    $('#question'+qID+' .question tbody td').click(function(){
 
      $('#question'+qID+' input.radio:checked').attr('checked', false);
      $('input.radio', this).attr('checked', true);
    });
 
  });
 
</script>

Cheers,
Tony Partner
Solutions, code and workarounds presented in these forums are given without any warranty, implied or otherwise.

Last edit: 12 years 7 months ago by tpartner.

The topic has been locked.

tpartner
Offline
LimeSurvey Community Team

More

12 years 7 months ago - 12 years 7 months ago #65516 by tpartner

Replied by tpartner on topic Evaluative Space Grid - once again...

After a little thought, I think the Evaluative Space Grid can be better accomplished by using a multiple-numeric question. A table can be shown in the question. When a respondent clicks a grid cell in the table, JavaScript loads the coordinates of the cell into the question inputs.

1) Create a Multiple Numeric question with two sub-questions labelled "X" and "Y".

2) Add the following HTML to the source of the question to create the table:

Code:

<table class="spaceGrid">
    <tr>
        <td rowspan="5" class="yAxisLabel">How NEGATIVE<br>
            do you feel about<br>
        the stimulus?</td>
        <td class="yLabel">Extremely</td>
        <td class="gridCell"></td>
        <td class="gridCell"></td>
        <td class="gridCell"></td>
        <td class="gridCell"></td>
        <td class="gridCell"></td>
    </tr>
    <tr>
        <td class="yLabel">Quite a bit</td>
        <td class="gridCell"></td>
        <td class="gridCell"></td>
        <td class="gridCell"></td>
        <td class="gridCell"></td>
        <td class="gridCell"></td>
    </tr>
    <tr>
        <td class="yLabel">Moderately</td>
        <td class="gridCell"></td>
        <td class="gridCell"></td>
        <td class="gridCell"></td>
        <td class="gridCell"></td>
        <td class="gridCell"></td>
    </tr>
    <tr>
        <td class="yLabel">Slightly</td>
        <td class="gridCell"></td>
        <td class="gridCell"></td>
        <td class="gridCell"></td>
        <td class="gridCell"></td>
        <td class="gridCell"></td>
    </tr>
    <tr>
        <td class="yLabel">Not at all</td>
        <td class="gridCell"></td>
        <td class="gridCell"></td>
        <td class="gridCell"></td>
        <td class="gridCell"></td>
        <td class="gridCell"></td>
    </tr>
    <tr>
        <td class="blankCell"></td>
        <td class="blankCell"></td>
        <td class="xLabel">Not at all</td>
        <td class="xLabel"><span class="yLabel">Slightly</span></td>
        <td class="xLabel"><span class="yLabel">Moderately</span></td>
        <td class="xLabel"><span class="yLabel">Quite a bit</span></td>
        <td class="xLabel"><span class="yLabel">Extremely</span></td>
    </tr>
    <tr>
        <td class="blankCell"></td>
        <td class="blankCell"></td>
        <td colspan="5" class="xAxisLabel">How POSITIVE do you feel about the stimulus?</td>
    </tr>
</table>

3) Add the following styles to the end of your template.css file:

Code:

.spaceGrid {
  border: 0 none;
  border-collapse: collapse;
}
 
.spaceGrid td {
  padding: 0 3px;
  text-align: center !important;
  border: 0 none;
}
 
td.xAxisLabel {
  padding-top: 10px;
}
 
td.yAxisLabel {
  padding-right: 10px;
  width: 125px;
}
 
td.xLabel {
  height: 20px;
  font-weight: normal;
}
 
td.yLabel {
  text-align: right !important;
  font-weight: normal;
}
 
td.gridCell {
  width: 70px;
  height: 70px;
  border: 1px solid #666666;
  background-color: #FFFFFF;
  cursor: pointer;
}
 
td.checkedCell {
  background-color: #66FF00;
}

4) Add the following to the end of your template.js file:

Code:

$(document).ready(function() {
 
    // Listener on the grid cells
    $('.gridCell').click(function(){
 
      // Define some vars
      var parentQ = $(this).parents('div[id^="question"]:eq(0)');
      var parentTable = $(this).parents('table.spaceGrid:eq(0)');
      var parentRow = $(this).parent();
      var numGridCell = $('.gridCell').length;
      var numCols = $('.gridCell', parentRow).length;
      var numRows = numGridCell/numCols;
 
      // Add class to checked cell
      $('.checkedCell', parentQ).removeClass('checkedCell');      
      $(this).addClass('checkedCell');
 
      // Find the cell coordinates
      var reverseRowIndex = (numRows - $('tr', parentTable).index($(parentRow)));
      var colIndex = $('.gridCell', parentRow).index($(this)) + 1;
 
      // Load coordinates into inputs
      $('input.text:eq(0)', parentQ).val(colIndex);
      $('input.text:eq(1)', parentQ).val(reverseRowIndex);
    });
 
  });

The script should automatically handle different grid sizes.

Cheers,
Tony Partner
Solutions, code and workarounds presented in these forums are given without any warranty, implied or otherwise.

Attachments:

...2011-09-10.PNG

Last edit: 12 years 7 months ago by tpartner.

The following user(s) said Thank You: c_schmitz, jesterstear

The topic has been locked.

gribouts
Offline
New Member

More

12 years 7 months ago #65517 by gribouts

Replied by gribouts on topic Evaluative Space Grid - once again...

waow ! gonna check this asap, looks absolutely amazing !
thanks a million for sharing such an idea

The topic has been locked.

gribouts
Offline
New Member

More

12 years 7 months ago #65570 by gribouts

Replied by gribouts on topic Evaluative Space Grid - once again...

hmm, does not work so far. I've tried it with two versions of LS.

1) version 1.73 : I can make the grid appear but there isn't the template.js file. Thus, the grid remains as a screenshot .. I use this version most of the time as I dont do anything technical usually with LS.

2) version 1.87RC2: The grid refuses to appear.. I dont see any mistakes in the code, though, I don't really understand what happens on this version.

After, those two tests, I wanted to knoy which version of LS you've used when you pasted your screenshot. I'm also wondering about what will be printed in the database after using such type of question. We will see the two answers in it isnt it ? One on X and the other on Y ? Thanks a million for your help, I feel like a solution is nearly found !

Regards, grib.

The topic has been locked.

gribouts
Offline
New Member

More

12 years 7 months ago #65572 by gribouts

Replied by gribouts on topic Evaluative Space Grid - once again...

worked perfectly with the 1.91 ! Thanks a million for your help, that's wonderful ! Wish I could understand smthg about javascript oneday...

Regards,
grib.

The topic has been locked.

jesterstear
Topic Author
Offline
New Member

More

12 years 5 months ago #67609 by jesterstear

Replied by jesterstear on topic Evaluative Space Grid - once again...

this seems to be a nice solution!

best regards, jester.

The topic has been locked.

jesterstear
Topic Author
Offline
New Member

More

12 years 5 months ago - 12 years 5 months ago #67611 by jesterstear

Replied by jesterstear on topic Evaluative Space Grid - once again...

holch, the idea behind is that you can have, for instance, both positive and negative (or ambiguous) feelings toward an object at the same time. If posivity and negativity are high it's ambiguity, if they are low it's indifference. Think about a movie like "triumph of the will" or several dramatic or non-happy endings of films. For instance, they leave you probably with a bittersweet taste, and you cannot measure this with other single item measures.
best regards, jester

Last edit: 12 years 5 months ago by jesterstear.

The topic has been locked.

Lime-years ahead

Online-surveys for every purse and purpose

Pricing & Plans

Get started

Welcome to the LimeSurvey Community Forum

Evaluative Space Grid - once again...

Lime-years ahead

Legal

About Us

Open Source