Skip to content
JqPool.js is a lightweight jQuery plugin that converts poll questions stored in a JSON file into a wizard-like survey interface.
JavaScript CSS HTML
Branch: master
Clone or download
Latest commit fa12a6c Apr 14, 2016
Permalink
Type Name Latest commit message Commit time
Failed to load latest commit information.
css JqPool.js Apr 14, 2016
.gitattributes :neckbeard: Added .gitattributes & .gitignore files Apr 13, 2016
.gitignore :neckbeard: Added .gitattributes & .gitignore files Apr 13, 2016
README.md Create README.md Apr 14, 2016
index.html JqPool.js Apr 14, 2016
jqpool.js JqPool.js Apr 14, 2016
questions.json JqPool.js Apr 14, 2016

README.md

jq_plugin

jqpool.js is a lightweight jQuery plugin that converts poll questions stored in a JSON file into a wizard-like survey interface.

How to use it:

1. Create the Html for the survey with next / prev buttons.

<div class="question-container"></div>
<a id="backBtn" href="#" class="button">« Back</a>
<a id="nextBtn" href="#" class="button">Continue »</a>
 

2. Prepare your survey questions in the JSON file. The data structure should be like this:

[  
    {  
        "text":"Вопрос 1?",
        "id":"2",
        "break_after":true,
        "required":true,
        "type":"single-select",
        "options":[  
            "Ответ 1",
            "Ответ 2",
            "Ответ 3",
            "Ответ 4"
        ]
    },
    {  
        "text":"Вопрос 2?",
        "id":"3",
        "required":true,
        "type":"single-select",
        "options":[  
            "Ответ 1",
            "Ответ 2",
            "Ответ 3",
            "Ответ 4"
        ]
    },
    {  
        "text":"Вопрос 3?",
        "id":"4",
        "type":"single-select",
        "options":[  
            "Ответ 1",
            "Ответ 2",
            "Ответ 3",
            "Ответ 4"
        ]
    },
    {  
        "text":"Вопрос 4?",
        "id":"5",
        "type":"single-select",
        "options":[  
            "Ответ 1",
            "Ответ 2",
            "Ответ 3"
    ]
},
{  
    "text":"Вопрос 5?",
    "id":"6",
    "type":"single-select",
    "options":[  
        "Ответ 1",
        "Ответ 2",
        "Ответ 3",
        "Ответ 4"
    ]

}

]

 

3. Load jQuery library and the jQuery survey plugin in your web page.

<script src="//code.jquery.com/jquery-1.11.3.min.js"></script>
<script src="jqpool.js"></script>
 

4. Add your own CSS to style the survey.

.question {
  ...
}
 
You can’t perform that action at this time.