...
It is used when the respondent is redirected back to the client platform after completion of the Virtual Shelf exercise. This example below requests the respondent Data. i.e. what they clicked on and outputs this for the client to implement/map to the field required.
You can see a live example of this in the below link:
Run this Example in JSfiddle.net
...
Code Block | ||
---|---|---|
| ||
/* © 2018 ConceptSauce ltd */ /* The API URL and the Respondent ID */ var mappleUrl = "https://survey-api.csiolabsconceptsauce.meio/?projectid=4963d1e1d9a9f217-07760c9a-48c6498e-6690b461-83a76a7c7b5fe96976a92f36&pageid=9178c8b3a6ea1ece-1dc15273-444d4431-65c0bff5-8e5e142b7e50b92937d83642&respondentid=hn12345ABSTEST1", submitButton = document.getElementById("btn_continue"); function onSuccess(result) { var questions = result.questions, ul = document.getElementsByTagName("ul"); questions.forEach(function(question) { if (question.questionTitle === "q1q2") /* CAUTION... Virtual Shelf QType NameID set in CS Platform. Make sure you change q1 to the correct title! */ { var products = question.qResponseData.basketContent; productsBoughtFill(ul, products); var clicked = question.qResponseData.productViewEvents; productsClickFill(ul, clicked); } }); submitButton.style.visibility = "visible"; } function onError(response) { alert("Error"); } function productsBoughtFill(ul, products) { var myCount = 0; if (products.length) { ul[0].innerHTML += "<strong>BOUGHT:</strong>"; products.forEach(function(product, id) { ul[0].innerHTML += "<li>UPC: " + product.userMeta.UPC + " title "</br>TITLE: " + product.title + " qty "</br>QTY: " + product.quantity + " Per Item Price "</br>Price: " + product.priceParams.basePrice + "</li>" }); } } function productsClickFill(ul, products) { if (products) { var clickedString = ""; ul[0].innerHTML += "<strong>CLICKED:</strong>"; products.forEach(function(product, id) { ul[0].innerHTML += "<li>UPC: " + product.userMeta.UPC + " title "</br>TITLE: " + product.title + "</li>"; }); } } function getJSON(url, success, error) { var xhr = new XMLHttpRequest(); xhr.open('GET', url, true); xhr.responseType = 'json'; xhr.onload = function() { var status = xhr.status; if (status === 200) { success(xhr.response); } else { error(xhr.response); } }; xhr.send(); }; getJSON(mappleUrl, onSuccess, onError); |
You can see a live example of this in the below link:
https://jsfiddle.net/pabragin/7r4jabhw/26/