A basic example of a poll form with a question and a simple Yes/No answer. The response is stored as a tagattached to the current user. You can also modify the code to useevents instead and store more data (like the current page the user is on, the question text, username, etc.).
Example
A simple poll functionality implemented using UXWizz to store the results
You can test in this JSFiddle (note that this fiddle does not actually send data to UXWizz).
HTML:
Add this before the end of the </body> tag.
JavaScript:
Add this in a <script> tag or include it as an external JavaScript file somewhere after the tracker is included.
CSS:
Include this in a <style> tag or as an external CSS file.
JavaScript one-liner
Alternatively, you can combine the HTML, CSS and JS in a single JS snippet and include it:
(function() {
if (localStorage) {
if (localStorage['ust-poll-closed']) return;
}
var prevOnLoaded = UST.onLoaded;
UST.onLoaded = function () {
prevOnLoaded && prevOnLoaded();
var poll = document.querySelector('#ust-poll');
poll.style.display = 'inline-block';
poll.style.transform = 'translateX(-50%) scaleY(1)';
function close() {
poll.style.display = 'none';
localStorage && (localStorage['ust-poll-closed'] = true);
}
document.querySelector('#ust-poll__close').addEventListener('click', close);
function clickedAnswer(e) {
close();
// Add a tag to the user like `poll_no` or `poll_yes`
// You could also use addEvent instead to store more data
UST.addTag('poll_' + e.currentTarget.value);
}
var answers = document.querySelectorAll('.ust-poll__answer');
for (var i = 0; i < answers.length; ++i) {
answers[i].addEventListener('click', clickedAnswer);
}
}
})();
