Show more than one questions in the same page

From Catglobe Wiki
Revision as of 08:32, 8 March 2010 by Catglobe (talk | contribs) (quest.onInit)
Jump to: navigation, search

Introduction

There is a common need of showing more than one questions in the same page, but unfortunately it is not supported by the current editor (we hope it will be possible with the new viewer in a near future)

In the mean time, we need to have some work-arround tips to make it work.

Solutions

The main idea is that when we want to display a question not in its own page, there must be an input element added to that page's html with name following a specific format: non grid question should have name as QUESTION.question_label, grid questions use names as QUESTION.question_label.grid_index.
It is very important that questions to be displayed in other pages must be made as DUMMY.

Example 1:

I want to show my single question labeled Q1 in another question with radio buttons, I need to make sure the HTML contains the following code for each answer option.

<tr>
   <td width="16px" valign="top" align="center">
      <input type="radio" value="1" name="QUESTION.Q1">
   </td>
   <td valign="top" align="left">
      Answer option text 1
   </td>
</tr>

Example 2:
I want to show a single grid question label Q1 in another question, I need to make sure the HTML contains the following code for each answer option and each sub question. Q1 has 2 answer options

<tr>
   <td width="16px" valign="top" align="center">
      <input type="radio" value="1" name="QUESTION.Q1.0">
   </td>
   <td width="16px" valign="top" align="center">
      <input type="radio" value="2" name="QUESTION.Q1.0">
   </td>

</tr>

There are basically 3 ways of changing a question's HTML.

Use HTML

This one is obvious, you can use HTML Editor to edit a question's text to include other questions.
Due to the fact that non-page questions have specific generated HTML code based on their answer options, it is usually hard to inject other questions and to make it look nice enough.
This method is usualy used when using a page question to display other questions, and it is convenient to use when the requirements are complex and the texts are not likely to change much.
The disadvantage of this method is that it is difficult to modify if the HTML is too complex.

quest.onInit

This function is called after the HTML of the question is generated, therefore it is the best to use JQuery to insert the elements added to the HTML.
It would be useful to use tools like Firebug to know the ids/names of the elements where we want to insert.

quest.getHTML