Welcome, Guest
Username: Password:

TOPIC: Image button with array type question (multiple rows issue...)

Image button with array type question (multiple rows issue...) 3 years 1 month ago #94199

  • cnsla
  • cnsla's Avatar
  • Offline
  • Fresh Lemon
  • Posts: 6
  • Karma: 0
I'm trying to make the array type question with image buttons (replacing radio buttons-exactly, hiding and replacing them).
Like image below. My participants will be asked to choose one lego head, one arrow, one lemon, then click next.

I found the post dealing with similar problem.

and I successed with the code below with RADIO TYPE Question.

<a href="javascript:selectface(0);"><img class="face num0" src="https://www.limesurvey.org/media/kunena/emoticons/cool.png" /></a> 
<a href="javascript:selectface(1);"><img class="face num1" src="https://www.limesurvey.org/media/kunena/emoticons/sad.png" /></a> 
<a href="javascript:selectface(2);"><img class="face num2" src="https://www.limesurvey.org/media/kunena/emoticons/smile.png" /></a>
<a href="javascript:selectface(3);"><img class="face num3" src="https://www.limesurvey.org/media/kunena/emoticons/laughing.png" /></a>
<a href="javascript:selectface(4);"><img class="face num4" src="https://www.limesurvey.org/media/kunena/emoticons/cheerful.png" /></a>
<a href="javascript:selectface(5);"><img class="face num5" src="https://www.limesurvey.org/media/kunena/emoticons/wink.png" /></a>
<a href="javascript:selectface(6);"><img class="face num6" src="https://www.limesurvey.org/media/kunena/emoticons/tongue.png" /></a>
<a href="javascript:selectface(7);"><img class="face num7" src="https://www.limesurvey.org/media/kunena/emoticons/unsure.png" /></a>
<a href="javascript:selectface(8);"><img class="face num8" src="https://www.limesurvey.org/media/kunena/emoticons/angry.png" /></a>
<br />
<script type="text/javascript" charset="utf-8">
    function selectface(face) {
        $('#question1759 input.radio:eq('+face+')').attr('checked', true);
    $(document).ready(function() {
        $('#question1759 .survey-question-answer ').hide();
        $('#question1759 .questionhelp ').hide();
        selectface($('#question1759 input.radio:checked').val() - 1);
<style type="text/css">
.face {
border:4px solid white;
.selected {
border:4px solid #cc0000;

However, I have to make 3 rows, and cannot find the way to change the sourcecode....
I guess I should modify

$('#question1759 input.radio:eq('+face+')').attr('checked', true);

but, the code above is for radio type question and I have no idea to specify one row in array type question with the line.

Please, somebody help me : )
The administrator has disabled public write access.
Moderators: ITEd
Time to create page: 0.571 seconds