LimeSurvey forums :: Thema: autocomplete text input depending on answer of a dropdown (1/1)

Willkommen, Gast

THEMA: autocomplete text input depending on answer of a dropdown

autocomplete text input depending on answer of a dropdown 4 Monate 2 Wochen her #90726

Gabriela
OFFLINE
Senior Lime
Beiträge: 51
Karma: 0

hi all,
have a dropdown with a list of provinces. when the user chooses a province I need that next input text box (districts) reads a set of variables for Autocomplete just according to the province that was chosen..

eg: write something like this in the code of the short text (district question):
<script type="text/javascript" charset="utf-8">

$(document).ready(function() {

var province1 = "Anacuabe,Balama,Chiúre,Ibo,Macomia,Mecufi,Meluco,Mocímboa da Praia,Montepuez,Mueda,Muidumbe,Namuno,Nangade,Palma,Pemba Metuge,Quissanga".split(',');

var province2 = "BileneMacia,Chibuto,Chicualacuala,Chigubo,Chókwè,Guijá,Mabalane,Manjacaze,Massangena,Massingir,Xai-Xai".split(',');

});
</script>

so if on the previous question (wich is a dropdown) was chosen province 2, the autocomplete function in this question (short text) reads only the group of districts according to province2.
is tis possible?
thanks you very much

Der Administrator hat öffentliche Schreibrechte deaktiviert.

Re: autocomplete text input depending on answer of a dropdown 4 Monate 2 Wochen her #90727

tpartner
ONLINE
LimeSurvey Team
Beiträge: 2868
Dank erhalten: 427
Karma: 246

You can put a listener on the drop-down to change the data source for the autocomplete with something like the code below.

For this example:
- The dropdown list of provinces has answer codes "1", "2"and "3"
- The code manipulates the first drop-down and text input on the page. The selectors may need to be modified if you questions are in different positions.

<script type="text/javascript" charset="utf-8">
	$(document).ready(function() {
		// Assign some vars
		var qProvince = $('.list-dropdown:first');
		var qDistrict = $('.text-short:first');
		var selectedProvince;
 
		// The districts
		var provinceDefault = "".split(',');  
		var province1 = "Anacuabe,Balama,Chiúre,Ibo,Macomia,Mecufi,Meluco,Mocímboa da Praia,Montepuez,Mueda,Muidumbe,Namuno,Nangade,Palma,Pemba Metuge,Quissanga".split(',');
		var province2 = "BileneMacia,Chibuto,Chicualacuala,Chigubo,Chókwè,Guijá,Mabalane,Manjacaze,Massangena,Massingir,Xai-Xai".split(',');
		var province3 = "Funhalouro,Govuro,Homoine,Jangamo,Inharrime,Inhassoro,Mabote,Massinga,Morrumbene,Panda,Vilankulo,Zavala".split(',');
 
 
		// Initial data source for the autocomplete
		switch($('select', qProvince).val()) {
			case '1':
				selectedProvince = province1;
				break;
			case '2':
				selectedProvince = province2;
				break;
			case '3':
				selectedProvince = province3;
				break;
			default :
				selectedProvince = provinceDefault;
				break;
		}
 
		// Apply autocomplete to the text input
		$('input.text', qDistrict).autocomplete({
			source: selectedProvince		
		});
 
		// Listener on the dropdown
		$('select', qProvince).change(function() {
 
			// Clear the text input
			$('input.text', qDistrict).val('');
 
			// Define the new data source
			switch($(this).val()) {
				case '1':
					selectedProvince = province1;
					break;
				case '2':
					selectedProvince = province2;
					break;
				case '3':
					selectedProvince = province3;
					break;
				default :
					selectedProvince = provinceDefault;
					break;
			}			
			$('input.text', qDistrict).autocomplete('option','source',selectedProvince);
		});
	});
</script>

Here's a demo survey with the code in the source of the "Province" question.

Dateianhang:

Dateiname: limesurvey_survey_268652.lss
Dateigröße: 15 KB

Cheers,
Tony

LimeSurvey is open-source and run entirely by volunteers so please consider donating to support the project.

Der Administrator hat öffentliche Schreibrechte deaktiviert.

Re: autocomplete text input depending on answer of a dropdown 4 Monate 2 Wochen her #90728

Gabriela OFFLINE Senior Lime Beiträge: 51 Karma: 0	Grande!! I tested your example. It works perfect. Thanks..! Ill apply it on my survey and answer back. thanks again.
	Der Administrator hat öffentliche Schreibrechte deaktiviert.

Re: autocomplete text input depending on answer of a dropdown 4 Monate 2 Wochen her #90730

Gabriela OFFLINE Senior Lime Beiträge: 51 Karma: 0	Hi again, please, whan you can, can you check this? I filled it with all the provinces , districts ect.. but its not working properly. Just the last province (Zambezia) seems to be responding.(can it be there are too many variables to read?) Thanks a lot. Anhang: limesurvey...8998.lss (30KB)
	Der Administrator hat öffentliche Schreibrechte deaktiviert.

Re: autocomplete text input depending on answer of a dropdown 4 Monate 2 Wochen her #90731

tpartner
ONLINE
LimeSurvey Team
Beiträge: 2868
Dank erhalten: 427
Karma: 246

Your answer codes for the provinces don't match what you are looking for in the switch statements.

Either change the answer codes like this:

Or modify the switch statement like this:

			switch($('select', qProvince).val()) {
				case 'A1':
					selectedProvince = cabodelgado;
					break;
				case 'A2':
					selectedProvince = gaza;
					break;
				case 'A3':
					selectedProvince = inhambane;
					break;
				case 'A4':
					selectedProvince = manica;
					break;
				case 'A5':
					selectedProvince = maputo;
					break;
				case 'A6':
					selectedProvince = nampula;
					break;
				case 'A7':
					selectedProvince = niassa;
					break;
				case 'A8':
					selectedProvince = sofala;
					break;
				case 'a9':
					selectedProvince = tete;
					break;
				case 'A10':
					selectedProvince = zambezia;
					break;
				default :
					selectedProvince = provinceDefault;
					break;
			}

Here is the survey with the corrected answer codes.

Dateianhang:

Dateiname: limesurvey_survey_18998_2.lss
Dateigröße: 27 KB

Cheers,
Tony

LimeSurvey is open-source and run entirely by volunteers so please consider donating to support the project.

Letzte Änderung: 4 Monate 2 Wochen her von tpartner.

Der Administrator hat öffentliche Schreibrechte deaktiviert.

Re: autocomplete text input depending on answer of a dropdown 4 Monate 2 Wochen her #90732

Gabriela
OFFLINE
Senior Lime
Beiträge: 51
Karma: 0

Thanks, I found out that error. Somehow in my survey its A1, A2, ect..thanks.
So now its nearly over.
Now Im trying to discover how to change this:

var qDistrict = $('.text-short:first');

cause in my survey the district short text is not the first text-short in the survey, but the second. (its has another question above all, input text aswell, wich is grabbing the autocomplete function..
I tried var qDistrict = $('.text-short:second');

which of course didnt work..
Know nothing about javascript, how do you refer to a second input text? trying to solve it..
grazie mille.

Der Administrator hat öffentliche Schreibrechte deaktiviert.

Re: autocomplete text input depending on answer of a dropdown 4 Monate 2 Wochen her #90733

tpartner ONLINE LimeSurvey Team Beiträge: 2868 Dank erhalten: 427 Karma: 246	No, $('.text-short:second') won't work but you can use the index of the "text-short" class. Indexes start at 0 so the second short text would be: var qDistrict = $('.text-short:eq(1)') Or you can use the question ID. Something like this where "12345" is your question ID: var qDistrict = $('#question12345')
	Cheers, Tony LimeSurvey is open-source and run entirely by volunteers so please consider donating to support the project. Der Administrator hat öffentliche Schreibrechte deaktiviert.

Re: autocomplete text input depending on answer of a dropdown 4 Monate 2 Wochen her #90734

Gabriela OFFLINE Senior Lime Beiträge: 51 Karma: 0	finally!! grande, thanks a lot. It works..Till next dilema appears. (and supose I exceeded my question quota with this one) thank u so much.
	Der Administrator hat öffentliche Schreibrechte deaktiviert.

Forum

Englische Support Foren

Can I do this with LimeSurvey?

autocomplete text input depending on answer of a dropdown