If you want to display single choice in a Radio Button Grid vertically this JavaScript will do just this but record the data in the same format by row.
Check it out in an example survey!
OR
Add this survey to your US account or your EU account.
Paste the below JavaScript in a JavaScript action on the page where your Radio Button Grid resides.
We recommend setting logic on this action so that it is only displayed if ismobile = false
, especially if you are using the One-at-a-time interaction under Style > Layout > Mobile Interaction; otherwise it will interfere with how the questions are displayed on mobile.
$(document).ready(function(){
$(function() {
var table = $('.sg-table');
table.find('thead tr').detach().prependTo( table.find('tbody') );
var t = table.find('tbody').eq(0);
var r = t.find('tr');
var cols= r.length;
var rows= r.eq(0).find('td,th').length;
var cell, next, tem, i = 0;
var tb= $('<tbody></tbody>');
while(i<rows){
cell= 0;
tem= $('<tr></tr>');
while(cell<cols){
next= r.eq(cell++).find('td,th').eq(0);
tem.append(next);
}
tb.append(tem);
++i;
}
table.find('tbody').remove();
$(tb).appendTo(table);
$(table)
.find('tbody tr:eq(0)')
.detach()
.appendTo( table.find('thead') )
.children()
.each(function(){
$(this).replaceWith('<th scope="col">'+$(this).html()+'</th>');
});
$(table)
.find('tbody tr th:first-child')
.each(function(){
$(this).replaceWith('<td scope="row">'+$(this).html()+'</td>');
});
table.show();
});
$("td").click(function() {
$selector = $(this).parent("tr").children().index($(this)) + 1;
//$(".sg-table tr td:nth-child("+$selector+")").fadeTo(300,0.4); //optional fading of column after ticking script for usability
});
$(".sg-type-table-radio input:radio").unbind();
});
Scripting and Other Custom Solutions
We’re always happy to help you debug any documented script that is used as is. That said, we do not have the resources to write scripts on demand or to debug a customized script.
If you have customization ideas that you haven't figured out how to tackle, we're happy to be a sounding board for SurveyGizmo features and functionality ideas that might meet your needs. Beyond this, check out our Professional Services; these folks have the scripting chops to help you to achieve what you are looking for!
Admin
— Dave Domagalski on 09/18/2019
@Justin: Thank you for your note and feedback!
I have added an option to download the example to an EU Account.
While it should be possible to perform a similar modification to a Checkbox Grid, I'm afraid we do not have any ready-made examples for this.
I'm sorry for the trouble!
David
Technical Writer
SurveyGizmo Learning & Development
— Justin on 09/18/2019
Also as we are on the EU server it doesn't allow us to add this survey to our account. How can we add it?
— Justin on 09/18/2019
Hi Bri - is there any way of doing this for checkbox grids as well?