TOPIC:

Geolocation on Form with Email of location sent to email recipient 2 years 7 months ago #223352

  • Topic Author
  • xsbucks
  • Offline
  • Fresh Breezer
  • Fresh Breezer
  • Posts: 3
  • Thanks: 0
Hello,

I have shred through the forums attempting to find an answer for this. I have found a few answers that i wasn't able to determine if they were right for me.

I am trying to create a QuickForm that will allow the location of the user that is submitting the form. The Location will be sent to the recipient of the email on submit alongside of the other form details.

Is there currently anything that will allow this?

Thank You Kindly.

Please Log in or Create an account to join the conversation.

Geolocation on Form with Email of location sent to email recipient 2 years 7 months ago #223361

  • DarkoCujic's Avatar
  • DarkoCujic
  • Offline
  • Developer
  • Developer
  • Posts: 2154
  • Karma: 67
  • Thanks: 265
Hey XSBucks,

are you talking about simple geolocation? Something like this?

If so, I can walk you through the process. Keep in mind that geolocation works only on secure connections, meaning your site has to have a SSl certificate, otherwise, you'll get an error.

So, first thing's first. Create two elements in your form, one for latitude and one for longitude and give them appropriate names.
Next is to select your form > Advanced tab > More options > Scripts > Initialization scripts, click custom and there paste the following:
function ff_geolocation_init()
{
    if (navigator.geolocation) {
        navigator.geolocation.getCurrentPosition( displayLocation, handleError );
    } else {
        ff_getElementByName('ff_nm_latitude[]').value = ff_getElementByName('ff_nm_longitude[]').value = 'Your browser does not support geolocation.';
    }
} // ff_geolocation_init

function displayLocation(position){
  ff_getElementByName('ff_nm_latitude[]').value = position.coords.latitude;
  ff_getElementByName('ff_nm_longitude[]').value = position.coords.longitude;
}

function handleError(error){
  switch(error.code) {
      case error.PERMISSION_DENIED:
          ff_getElementByName('ff_nm_latitude[]').value = ff_getElementByName('ff_nm_longitude[]').value = "User denied the request for Geolocation."
          break;
      case error.POSITION_UNAVAILABLE:
          ff_getElementByName('ff_nm_latitude[]').value = ff_getElementByName('ff_nm_longitude[]').value = "Location information is unavailable."
          break;
      case error.TIMEOUT:
          ff_getElementByName('ff_nm_latitude[]').value = ff_getElementByName('ff_nm_longitude[]').value = "The request to get user location timed out."
          break;
      case error.UNKNOWN_ERROR:
          ff_getElementByName('ff_nm_latitude[]').value = ff_getElementByName('ff_nm_longitude[]').value = "An unknown error occurred."
          break;
  }
}

There are a few things to change before testing it. The name of the first function should be ff_YOURFORMNAME_init(), second, ff_nm_latitude[] and ff_nm_longitude[] should be ff_nm_YOURLATITUDE[] and ff_nm_YOURLONGITUDE[]. Of course, written in lower case, this is just so you can easily spot what to change.

The including to the mailback and everything else is the same as any other element. We just run a script on start (initialization) to fill out the two fields.

Let me know how it goes and if I can be of further assistance.

Kind regards,
Darko
Satisfied with our support? PayPal tips
===========
Need to renew Pro Support? Buy Here!
===========
Satisfied? Consider a membership!
===========
Like us on Facebook
===========
Support Crosstec and get ALL EXTENSIONS and professional support for just $5. Here!

Please Log in or Create an account to join the conversation.

Geolocation on Form with Email of location sent to email recipient 2 years 7 months ago #223362

  • Topic Author
  • xsbucks
  • Offline
  • Fresh Breezer
  • Fresh Breezer
  • Posts: 3
  • Thanks: 0
Thank you for your speedy reply.

That will work fine for what I am needing. If I choose down the road to extend that a bit, Is there a way to translate the Lat and Long into a Google Map form with my own Google API?

Please Log in or Create an account to join the conversation.

Last edit: Post by xsbucks.

Geolocation on Form with Email of location sent to email recipient 2 years 7 months ago #223365

  • DarkoCujic's Avatar
  • DarkoCujic
  • Offline
  • Developer
  • Developer
  • Posts: 2154
  • Karma: 67
  • Thanks: 265
Hey,

of course. I mean, it depends on what you mean by Google Map form, but I have successfully added a map showing the location.

I did that by doing the following (and keep in mind this is one of several ways to do this):
- add a new submit button and a new section
- select that new section, under Description click edit and in that editor select to input code (Tools > <>Source code) and paste this:
<div id="ct_map_canvas" style="width: 100%; height: 400px;"> </div>
- for the button, add an action script, select custom, select click and paste this:
function ff_showMap_action(element, action)
{
    switch (action) {
        case 'click':
            var long = ff_getElementByName('ff_nm_longitude[]').value;
            var lat = ff_getElementByName('ff_nm_latitude[]').value;
            var geocoder;
            var map;
            
            map = '<img src="https://maps.googleapis.com/maps/api/staticmap?zoom=16&size=400x300&maptype=satellite&markers=color:red%7C' + lat + ',' + long +'&key=YOUR API KEY" />'; 
            jQuery(map).appendTo("#ct_map_canvas");
            break;
        default:;
    } // switch
} // ff_showMap_action
In this part, you have to change showMap to the name of your button and add your API key as I've removed mine.

If you have any questions, shoot :)

Kind regards,
Darko
Satisfied with our support? PayPal tips
===========
Need to renew Pro Support? Buy Here!
===========
Satisfied? Consider a membership!
===========
Like us on Facebook
===========
Support Crosstec and get ALL EXTENSIONS and professional support for just $5. Here!
The following user(s) said Thank You: xsbucks

Please Log in or Create an account to join the conversation.

Geolocation on Form with Email of location sent to email recipient 2 years 7 months ago #223448

  • Topic Author
  • xsbucks
  • Offline
  • Fresh Breezer
  • Fresh Breezer
  • Posts: 3
  • Thanks: 0
Worked like a charm!

The detail and steps you provided were very thorough. Thank you for your time and efforts.

Only thing i wish is that i came to Breezing Forms years ago.

Please Log in or Create an account to join the conversation.

Geolocation on Form with Email of location sent to email recipient 2 years 7 months ago #223449

  • DarkoCujic's Avatar
  • DarkoCujic
  • Offline
  • Developer
  • Developer
  • Posts: 2154
  • Karma: 67
  • Thanks: 265
Hey,

that's great to hear :)If you have any more questions, feel free to ask.

Kind regards,
Darko
Satisfied with our support? PayPal tips
===========
Need to renew Pro Support? Buy Here!
===========
Satisfied? Consider a membership!
===========
Like us on Facebook
===========
Support Crosstec and get ALL EXTENSIONS and professional support for just $5. Here!

Please Log in or Create an account to join the conversation.

  • Page:
  • 1
Moderators: ForumSupport
Time to create page: 0.052 seconds

BreezingForms Pro 1.4.7 for WordPress Released!

Available in the membership section.

September Discount!

Massive discounts on all subscriptions!

Get Your Subscription Here

Quick Links

Downloads

BreezingForms

ContentBuilder

BreezingCommerce

Templates

Documentation

BreezingForms

ContentBuilder

BreezingCommerce

Apprendre BreezingForms (French Community)

Apprendre et maîtriser BreezingForms par des tutoriels et exemples, le tout en français

breezingforms.eddy-vh.com

Questions et réponses sur les forums de l'AFUJ

AFUJ

Special Offer

Summer Sale! All subscriptions at a special price!

Includes prio support, all of our current and future Joomla!® extensions and Joomla!® templates for the duration of your membership.

Get it from here

3rd Party Discount - 25% Off

We help you to keep your costs under control. If you are a new member and purchased a form building tool from a different form vendor, then you'll get a 25% discount on our subscription plans.

How to receive the discount:

Send us a quick email to sales@crosstec.org with a proof of purchase (for example a paypal receipt), await payment instructions and enjoy your membership!