...
| Code Block | ||
|---|---|---|
| ||
Qualtrics.SurveyEngine.addOnload(function()
{
/*Place your JavaScript here to run when the page loads*/
QObj = this;
QObj.disableNextButton();
jQuery(QObj.questionContainer).find('.InputText').attr('placeholder', "Search by Course...")
jQuery(QObj.questionContainer).find('.InputText').autocomplete({
source: function( request, response){
jQuery.ajax({
url: 'https://qualtrics.uvu.edu/public/coursesearch',
dataType: 'json',
data: {
key: "allthedata",
term: request.term
},
success: function( data ) {
response(data.map(function (value) {
return {
'label': value.id + ' - ' + value.title,
'value': value.id,
'subject': value.subject,
'number': value.number
};
}));
}
})
},
minLength: 3,
select: function(event, ui) {
event.preventDefault();
jQuery(this).val(ui.item.label)
Qualtrics.SurveyEngine.setEmbeddedData("courseSubject", ui.item.subject);
Qualtrics.SurveyEngine.setEmbeddedData("courseNumber", ui.item.number);
jQuery(".ui-menu").hide();
QObj.enableNextButton();
return false;
},
focus: function(event, ui) {
return false;
}
});
});
Qualtrics.SurveyEngine.addOnReady(function()
{
/*Place your JavaScript here to run when the page is fully displayed*/
});
Qualtrics.SurveyEngine.addOnUnload(function()
{
/*Place your JavaScript here to run when the page is unloaded*/
jQuery(QObj.questionContainer).find('.InputText').autocomplete("destroy");
}); |
Step 3
Add the following jQuery reference script to the Header under General in the the Look & Feel of the survey:
| Code Block |
|---|
<script src="https://code.jquery.com/jquery-1.12.4.js"></script><script src="https://code.jquery.com/ui/1.12.1/jquery-ui.js"></script> |
...
Click the ‘Apply’ button in the bottom-right corner.
Step 4
Add a Web Service call to the survey flow below the question block that has the question you created in Step 1. Use the image below as a reference. The required fields are listed after the image, so you can copy and paste as needed.
...
Note: The text on the left side of the = sign under the Set Embedded Data section are the Embedded Data field names, which can be used throughout the survey to see the values returned by the API.
Click the ‘Apply’ button in the bottom-right corner.