generate coordinates on update

[Mylene]

Hi, I'd like to generate coordinates (latitude and longitude) for address, entered on update form

I know that there is a solution for submission form, however it doesn't work on update

Thanks!

 

[Mathilda]

Hi,

I modified script from this article. 

Code for the header:

<div id="cbwrapper">

Code for the footer:

</div><script type='text/javascript'>
var lat_id = 'EditRecordlat';
var lng_id = 'EditRecordlng';
var address_id = 'EditRecordAddress';
var city_id = 'EditRecordCity';
var state_id = 'EditRecordState';
var zip_id = 'EditRecordZip';
var wrapper_id = 'cbwrapper';
var msg1 = 'Please input a valid address';
if(typeof jQuery != 'undefined'){
var cb_geocoder = cb_geocoder = new google.maps.Geocoder();
$('#'+wrapper_id+' input[id=Mod0EditRecord]').click(function(e){
e.preventDefault();
var add = $('#'+address_id).val();
var city = $('#'+city_id).val();
var state = $('#'+state_id).val();
var zip = $('#'+zip_id).val();
if(!add || !city || !state || !zip){
alert(msg1);
}else{
var full = add +','+city+','+state+' '+zip;
cb_geocoder.geocode({address: full}, cbCallBack);
}
});
}else{
document.write('This Datapage require Standard Caspio Deployment for full functionality.');
}
function cbCallBack(locResult){
if(locResult != "" && locResult.length>0){
var lat1 = locResult[0].geometry.location.lat();
var lng1 = locResult[0].geometry.location.lng();
lat1 = Number(lat1);
lng1 = Number(lng1);
$('#'+lat_id).val(lat1);
$('#'+lng_id).val(lng1);
$('#'+wrapper_id+' form').submit();
}else{
alert(msg1);
}
}
</script>

Code for the html file where the datapage is deployed:

<script type="text/javascript" src="https://lib.caspio.com/pub/jquery/jquery.js"></script>
<script src="//maps.googleapis.com/maps/api/js?v=3.exp&sensor=false&key=YOUR_KEY" async="" defer="defer" type="text/javascript"></script>

You should place those two lines above the deploy code of the datapage.

Paste your google apikey instead of: YOUR_KEY

Cheers!

[Mylene]

Thank you!! It works

[Kurumi]

Hi All - I would like to add an update on this. When Responsive is Enabled in the DataPage, you may need to change the code from this article:
https://howto.caspio.com/tech-tips-and-articles/advanced-customizations/tech-nerating-geolocation-coordinates-from-web-form-submissions/

Instead of:

$('#' + wrapper_id +' form').submit();

change it to

$('#caspioform').submit();

[Roosta]

Hello all,

Would there be anyway to use this in a bulk edit web-form update so that when a list of addresses are updated it would then insert the Long/Lat for each selected record insted of having to do them individually?

Cheers!