Questionnaire

The Questionnaire component  consist of a series of questions, layouts such as page or section breaks, and conditional logic.

The Questionnaire component divides complex processes into sequential, manageable steps. It provides a guided experience, leading users through tasks with clear instructions and progress indicators. This makes the Questionnaire ideal for tasks like class registrations.

By structuring information into distinct stages, the Questionnaire component minimizes user overwhelm and enhances focus. This component not only improves the user experience by simplifying complicated tasks but also ensures accuracy and efficiency in process completion.

Component data

Release notes

Global resources:
cicon-package.zip | bootstrap-grid.css (4.4.1) | jquery-3.6.0.min.js

Functional grouping: Text and data

Demo

Configure: select the dropdowns below to display the variety of options that a Questionnaire supports.

Code


				
			

		
		
			
Responsive preview

			

				

					
				

			

		

		

	

    	




    
    
    



    
        

            

                
                    





    
    
    





    
        
            
Do
                
                
            

        
        
    
    
    




    
    


    

  • Hide download report button If the survey or questionnaire is not meant for internal purpose and not to educate the users.

  • Provide title for questionnaire above the questionnaire component to provide a quick reference point for participants to confirm that they are on the right page and answering questions related to the intended topic.
    


  • Ensure sections titles are labelled correctly will help to clearly demarcate sections, participants can mentally prepare for shifts in content and concentrate on one set of questions at a time, improving the quality of their responses.
    


  • Hide or show image component only if the image will help users understand the questionnaire better. By incorporating images that truly aid user comprehension and hiding those that do not, the questionnaire becomes more user-friendly and effective in eliciting accurate responses.
    





    



    









                
                    





    
    
    





    
    
        
            
Don't
                
                
            

        
        
    
    




    
    


    

  • Do not use progress container If the survey or questionnaire is very short (consist of 5 questions) and if the survey or questionnaire doesn’t have sections.

  • Do not use question number If the survey or question is very short (consist of 5 questions). Also, when the survey or question has only one section that has a quantifiable content. i.e. progress of the questionnaire is quantifiable/ linear.
    


  • Do not make previous button active for first questions in the questionnaire or survey.
    


  • Do not make next button active for last questions in the questionnaire or survey.