Pick, Group, and Rank question type - custom coding | XM Community
Skip to main content

For pick, group, and rank type questions, we're running into the issue where the item list is so long that it's difficult for participants to select an item at the bottom of the list and drag it up into the entry box. Is there anyway to increase the size of the entry box so that participants can drag items horizontally, directly into the box? Or do you have any other suggestions? Thanks in advance!! Erik  

Hi there,
I have run into the same issue. I have managed to make the entry box (aka the Group Container) bigger, but the issue now is that a user can only drop the items at the top of the entry box, despite it being much bigger.
I'll post the code I used to do this below, but know that I am no expert with code. However, to adjust the height of the box, change the number in the "height: 2000px" portion.

.Skin .PGR .DragAndDrop .Group h2, .Skin .PGR .DragAndDrop .Group ul, .Skin .PGR .DragAndDrop .Items h2, .Skin .PGR .DragAndDrop .Items ul {width:100%}
.Skin .PGR .DragAndDrop td.groupsContainerTd div > div { border: 4px solid; height: 2000px; }

To increase the height of the boxes, you can look at the answer I gave to Nick2020 here.
Since he had only one box, this wan't applicable, but if you have more than one box, it would be nice to add some identifier, so that people can know the boxes as they scroll down with the list. Here's what you'll need to add into the Question HTML.


Long Groups
Some changes you'll need to make:

  • QID53
    will need to the be changed to the question's id

  • group0
    is the first box, 
    group1
    will be the second.... you'll need to repeat it for as many boxes as you have.

Here's a working demo.

Leave a Reply


Terms & Conditions