Difference between revisions of "Reverse the position of the subquestion texts with their textboxes in the text-grid question"

From Catglobe Wiki
Jump to: navigation, search
(Created page with "=Reverse the position of the subquestion texts with their textboxes in the text-grid question= This guide will help you reverse the position of the subquestion texts with the...")
 
Line 1: Line 1:
=Reverse the position of the subquestion texts with their textboxes in the text-grid question=
+
= Reverse the position of the subquestion texts with their textboxes in the text-grid question =
  
 
This guide will help you reverse the position of the subquestion texts with their textboxes in the text-grid question such as below images:
 
This guide will help you reverse the position of the subquestion texts with their textboxes in the text-grid question such as below images:
  
Put below javascript code snippet into your text-grid question. The function reverseQuestionTextsWithTextBoxes() requires the textbox width parameter. This function will do the reverse and set the textboxes' width to the specifed width.
+
Put below javascript code snippet into your text-grid question. The function reverseQuestionTextsWithTextBoxes() requires the textbox width parameter. This function will do the reverse and set the textboxes' width to the specifed width. <source lang="javascript">
<source lang="javacript">
 
 
function reverseQuestionTextsWithTextBoxes(textBoxWidth /*number type and required*/) {
 
function reverseQuestionTextsWithTextBoxes(textBoxWidth /*number type and required*/) {
$('td.grid_subquestion_text').each(function() {
+
$('td.grid_subquestion_text').each(function() {
$(this).parent().append(this);
+
$(this).parent().append(this);  
$(this).prev()
+
$(this).prev()
.removeAttr('width').css({'border-left':'none', 'border-right':'dotted 1px #ccc', 'width': (Number(textBoxWidth) + 10) + 'px' })
+
.removeAttr('width').css({'border-left':'none', 'border-right':'dotted 1px #ccc', 'width': (Number(textBoxWidth) + 10) + 'px' })
.children('input:text').css('width', textBoxWidth + 'px');
+
.children('input:text').css('width', textBoxWidth + 'px');
});
+
});
 
}
 
}
  
 
quest.onInit = function() {
 
quest.onInit = function() {
reverseQuestionTextsWithTextBoxes(150);   // Reverse and set the textbox width to 150px
+
reverseQuestionTextsWithTextBoxes(150); // Reverse and set the textbox width to 150px
 
};
 
};
  
 
</source>
 
</source>

Revision as of 10:40, 14 November 2013

Reverse the position of the subquestion texts with their textboxes in the text-grid question

This guide will help you reverse the position of the subquestion texts with their textboxes in the text-grid question such as below images:

Put below javascript code snippet into your text-grid question. The function reverseQuestionTextsWithTextBoxes() requires the textbox width parameter. This function will do the reverse and set the textboxes' width to the specifed width.

function reverseQuestionTextsWithTextBoxes(textBoxWidth /*number type and required*/) {
 $('td.grid_subquestion_text').each(function() {
 $(this).parent().append(this); 
 $(this).prev()
 .removeAttr('width').css({'border-left':'none', 'border-right':'dotted 1px #ccc', 'width': (Number(textBoxWidth) + 10) + 'px' })
 .children('input:text').css('width', textBoxWidth + 'px');
 });
}

quest.onInit = function() {
 reverseQuestionTextsWithTextBoxes(150); // Reverse and set the textbox width to 150px
};