That code is intended to restrict a user to entering a value from the dropdown but does not use an alert. The test is fired on every keystroke so alerts would be
Code:
<script type="text/javascript" charset="utf-8">
$(document).ready(function() {
// Define the CSV filename
var csvName = 'linguas.csv';
// Define some paths
var surveyRoot = location.pathname.split('index.php')[0];
var templateName = $('head link[href*="template.css"]').attr('href').replace(/\/template.css/, '').split('/templates/')[1];
var templatePath = surveyRoot+'upload/templates/'+templateName+'/';
// Define the questions
var q1ID = '{QID}';
var q1 = $('#question'+q1ID);
var q2 = $(q1).nextAll('.text-short:eq(0)');
var q3 = $(q1).nextAll('.text-short:eq(1)');
// Define the path to the CSV
var url = templatePath+csvName;
// Restrict user access to the inputs
$('input.text', q2).attr('readonly', true);
$('input.text', q3).attr('readonly', true);
// Create an array to hold the CSV rows
var namesArr = new Array();
// Grab the CSV contents
$.get(url,function(data){
// Convert CSV contents to an array of arrays
fullArray = jQuery.csv()(data);
// Load the CSV rows array
$(fullArray).each(function(i, item){
namesArr.push(item[0]);
});
// Initialise the autocomplete plugin
$('input.text', q1).autocomplete({
source: namesArr,
// Event fired when a selection is made (ui.item.value refers to the selected item)
select: function(event, ui) {
// Find the column 2 and column 3 values associated with the selected column 1 value and load q2 and q3
$(fullArray).each(function(i, item){
if(item[0] == ui.item.value) {
// The value from column 2 of the CSV
$('input.text', q2).val(item[1]);
// The value from column 3 of the CSV
$('input.text', q3).val(item[2]);
}
});
}
}).change(function(){
var isValid = false;
var inputValue = $(this).val();
$(fullArray).each(function(i, item){
if (item[0].toLowerCase().match(inputValue.toLowerCase())) {
isValid = true;
}
});
if (!isValid) {
alert('Please enter a valid q1 value');
$(this).val('');
}
});
});
});
</script>
