Add an extra row before a sub question in a grid
Challenge
In order to categorize sub questions in a grid question
As a questionnaire creator
I want to add extra rows to the grid
Example
I have a single grid question.
I want to have an extra row to group some sub questions together.
Solution
Find the row in the grid, add a new row before it.
Code
1 //add a row before a sub question in the grid
2 //subQuestionIndex: the index of sub question which we should add a row before
3 //cssClass: the stylesheet that would be applied to the new row
4 //text: name of the sub question group
5 //includeAnswerOptionTexts: if it is true, answer option texts will be included in the new row
6 quest.addRowBefore = function(subQuestionIndex, cssClass, text, includeAnswerOptionTexts)
7 {
8 //get number of columns
9 var n = $(".grid_inner")[0].rows[0].cells.length;
10 var tr = $(".grid_inner").find("tr").eq(subQuestionIndex);
11
12 if (!includeAnswerOptionTexts)
13 {
14 $(this).before( $("<tr>")
15 .append($("<td colspan="+n+">").text(text).addClass(cssClass))
16 );
17 }
18 else
19 {
20 var tr = $("<tr>").append($("<td>").text(text).addClass(cssClass));
21 for (var j=0; j<quest.questions[0].options.length; j++)
22 {
23 tr.append($("<td>").text(quest.questions[0].options[j].text).addClass(cssClass));
24 }
25 $(this).before(tr);
26 }
27 }
28
29 quest.onInit = function()
30 {
31 this.addRowBefore(3, "extra_row_header", "My sub question group", true);
32 }