Toggle menu
876
3.8K
30.2K
279.1K
Catglobe Wiki
Toggle preferences menu
Toggle personal menu
Not logged in
Your IP address will be publicly visible if you make any edits.

Make whole cell clickable in single and multi grids: Difference between revisions

From Catglobe Wiki
Cg loc (talk | contribs)
No edit summary
CGHelpdesk (talk | contribs)
No edit summary
Line 8: Line 8:
*Add the below script to that question
*Add the below script to that question


== Code ==  
== Code ==
<source lang="javascript" line="1">
 
quest.onInit = function()
<source lang="javascript">
{
//Solution 1
  $(".grid_subquestion_odd,.grid_subquestion_even").click(
quest.onInit = function(){
            function(evt)
$(".grid_subquestion_odd,.grid_subquestion_even").click(
            {
function(evt) {
              if(evt.target.nodeName == "INPUT")
if(evt.target.nodeName == "INPUT")
                  return true;
return true;
              $(this).children("input").click();
$(this).children("input").click();
              return false;
return false;
            });
});
  }
  }


//Solution 2:
quest.onInit = function(){
// For single, singlegrid question
$('input[type="radio"][name^="QUESTION."]')
.parent()
.click(function(event) {
$(this).find('input[type="radio"][name^="QUESTION."]').attr('checked', true);
});
// For multi, multigrid question
var checkboxes = $('input[type="checkbox"][name^="QUESTION."]');
checkboxes.click(function(event) {
event.stopPropagation();
});
checkboxes.parent().click(function(event) {
var child = $(this).find('input[type="checkbox"][name^="QUESTION."]');
if(child.attr('checked'))
$(this).find('input[type="checkbox"][name^="QUESTION."]').attr('checked', false);
else
$(this).find('input[type="checkbox"][name^="QUESTION."]').attr('checked', true);
});
});
</source>
</source>
== Source ==
== Source ==
Questionnaire Resource Id on cg.catglobe.com site: 164079 (Question: Q10_Make_whole_cell_clickable_in_single_and_multi_)
Questionnaire Resource Id on cg.catglobe.com site: 164079 (Question: Q10_Make_whole_cell_clickable_in_single_and_multi_)

Revision as of 07:10, 11 November 2013

Challenge

Normally, the grid question require a click on the checkbox or radiobutton. Now, we want it to register the answer when the user click on the cell for the answer option.
Example

Solution

  • Create a grid question
  • Add the below script to that question

Code

//Solution 1
quest.onInit = function(){
 $(".grid_subquestion_odd,.grid_subquestion_even").click(
 function(evt) {
 if(evt.target.nodeName == "INPUT")
 return true;
 $(this).children("input").click();
 return false;
 });
 }

//Solution 2:
quest.onInit = function(){
	// For single, singlegrid question
	$('input[type="radio"][name^="QUESTION."]')
		.parent()
		.click(function(event) {
			$(this).find('input[type="radio"][name^="QUESTION."]').attr('checked', true);
		});
		
	// For multi, multigrid question
	var checkboxes = $('input[type="checkbox"][name^="QUESTION."]');
	checkboxes.click(function(event) {
			event.stopPropagation();
	});
	checkboxes.parent().click(function(event) {
			var child = $(this).find('input[type="checkbox"][name^="QUESTION."]');
			if(child.attr('checked'))
				$(this).find('input[type="checkbox"][name^="QUESTION."]').attr('checked', false);
			else
				$(this).find('input[type="checkbox"][name^="QUESTION."]').attr('checked', true);
	});
});

Source

Questionnaire Resource Id on cg.catglobe.com site: 164079 (Question: Q10_Make_whole_cell_clickable_in_single_and_multi_)