Autocomplete text input to grab location details to zoom onto map

More
2 months 2 weeks ago - 2 months 2 weeks ago #197744 by tpartner

Is it possible to have the map style set to Humanitarian on load (pls see attachment)?


<script type="text/javascript" charset="utf-8">
 
	$(document).on('ready pjax:complete',function() {
 
		$('#map_{SGQ}').css({
			'position': 'absolute',
			'left': '-9999em'			
		});		
 
		setTimeout(function() {
			$('.leaflet-control-layers-base label:eq(1) :radio').trigger('click');
 
			$('#map_{SGQ}').css({
				'position': 'relative',
				'left': 'auto'			
			});		
		}, 1000);
 
	});
</script>

Cheers,
Tony Partner

Solutions, code and workarounds presented in these forums are given without any warranty, implied or otherwise.
Official LimeSurvey Partner - partnersurveys.com
Last edit: 2 months 2 weeks ago by tpartner.
The following user(s) said Thank You: KhemrajC

Please Log in to join the conversation.

More
2 months 2 weeks ago #197823 by KhemrajC
Hi TPartner,


You are a real JQuery master!!!

The layer is indeed being automatically selected.

Thanks a lot.


Please see also see my previous posts:


I wish to achieve this,

www.limesurvey.org/forum/can-i-do-this-w...-map?start=15#197494

And this is my attempt,

www.limesurvey.org/forum/can-i-do-this-w...-map?start=15#197529


LSS are attached to these posts.


I am waiting for your reply to know about the next step forward.


Thanks and regards

Please Log in to join the conversation.

More
2 months 2 weeks ago - 2 months 2 weeks ago #197865 by tpartner
This script will apply autocomplete to the first sub-question of a multiple-short-text question and add a button to the third sub-question that will get the GPS coordinates (if allowed).

Both the autocomplete function and the getGPS() function will load the second sub-question with GPS coordinates formatted for use as the default location for the map.

<link href="/upload/surveys/{SID}/files/jquery-ui.min.css" rel="stylesheet" type="text/css" /> 
<script src="/upload/surveys/{SID}/files/jquery-ui.min.js"></script>
<script src="/upload/surveys/{SID}/files/jquery.csv.min.js"></script>
<script type="text/javascript" charset="utf-8">	
 
	$(document).on('ready pjax:complete',function() {
 
		// Identify this question
		var thisQuestion = $('#question{QID}');
 
		var url = "/upload/surveys/{SID}/files/NAMES_cleaned.csv";
 
		// Hide the second input
		$('.question-item:eq(1)', thisQuestion).hide();
 
		var Names = [];
		var Coords = { };
 
		$.get(url, function(data){
			fullArray = $.csv.toArrays(data);
			$(fullArray).each(function(i, item){
				Names.push(item[0]);
				Coords[item[0].toLowerCase()] = item[1];
			});
 
			// Initiate the Autocomplete plugin
			$('input[type=text]:eq(0)', thisQuestion).autocomplete({
				minLength: 2,
				source: Names,
				select: function(event, ui) {
					$('input[type=text]:eq(1)', thisQuestion).val(Coords[ui.item.value.toLowerCase()].replace(/;/, ' ')).trigger('keyup');
					$('input[type=text]:eq(2)', thisQuestion).val('').trigger('keyup');
				}
			}).on('change', function(e) {
				$('input[type=text]:eq(1)', thisQuestion).val(Coords[$.trim($(this).val()).toLowerCase()].replace(/;/, ' ')).trigger('keyup');
				$('input[type=text]:eq(2)', thisQuestion).val('').trigger('keyup');
			});
		});
 
		// Insert the GPS button
		$('input[type=text]:eq(2)', thisQuestion).before('<button type="button" class="btn btn-primary gps-button" style="margin-bottom: 5px;">Get GPS Coordinates</button>');
 
		// Get GPS coordinates
		$('.gps-button', thisQuestion).on('click', function(e) {
			getGPS();
		});
		function getGPS() {
			disableButtons();
			if (navigator.geolocation) {  
				navigator.geolocation.getCurrentPosition(showGPS, gpsError);
			} else {  
				$('input[type=text]:eq(2)', thisQuestion).val('No GPS Functionality');
				enableButtons();
			}
		} 
		function gpsError(error) {
			alert('GPS Error: '+error.code+', '+error.message);
			enableButtons();
		} 
		function showGPS(position) {
			$('input[type=text]:eq(0)', thisQuestion).val('').trigger('keyup');
			$('input[type=text]:eq(1)', thisQuestion).val(position.coords.latitude+' '+position.coords.longitude).trigger('keyup');
			$('input[type=text]:eq(2)', thisQuestion).val(position.coords.latitude+';'+position.coords.longitude).trigger('keyup');
			enableButtons();
		}
		function disableButtons() {
			$('#ls-button-submit').prop('disabled', true);
			$('.gps-button', thisQuestion).prop('disabled', true);
		}
		function enableButtons() {
			$('#ls-button-submit').prop('disabled', false);
			$('.gps-button', thisQuestion).prop('disabled', false);
		}
	});
</script>



Sample survey attached:

File Attachment:

File Name: limesurvey...1211.lss
File Size:57 KB

Cheers,
Tony Partner

Solutions, code and workarounds presented in these forums are given without any warranty, implied or otherwise.
Official LimeSurvey Partner - partnersurveys.com
Attachments:
Last edit: 2 months 2 weeks ago by tpartner.
The following user(s) said Thank You: KhemrajC

Please Log in to join the conversation.

More
2 months 2 weeks ago #197886 by KhemrajC
Hi TPartner,

Just tested it and as usual it is doing the job. Hats off.

Is there any possibility to avoid the second sub question to accept input by the user though it is not affecting any functionality?

Also, I wish that once the autocomplete is selected or the gps button is successful, that next button is automatically activated to the map.

Thanks a lot.

Best regards

Please Log in to join the conversation.

More
2 months 2 weeks ago #197895 by tpartner
The requirements here keep escalating. I'm afraid I'm done.

Cheers,
Tony Partner

Solutions, code and workarounds presented in these forums are given without any warranty, implied or otherwise.
Official LimeSurvey Partner - partnersurveys.com
The following user(s) said Thank You: DenisChenu

Please Log in to join the conversation.

More
2 months 2 weeks ago #197897 by KhemrajC
Hi,

You have really helped at the most complicated section and I am learning a lot from your codes.

I have now also shifted my attention to other part of the questionnaire.

Thanks a lot.

Best regards

Please Log in to join the conversation.

Start now!

Just create your account and start using Limesurvey today.

Register now