Multiple maps in form

you do a lot of good work.

thank you ??

Is it possible (if so, how) to insert several maps in the form?

I think it should be possible, I originally designed it to be, but this is something I have never frankly tested. Have you tried it?

EDIT: I just had a quick look in the code and realised this is not possible. I will see if it can be done and get back to you.

adding a route option,

so you can execute routing functionality on the gmpa3 object which is now exposed using js events (see FAQ #10).

where the form will send us the coordinates of individual route points.

you would then need to store the routing coords into a custom hidden field (possibly a JSON serialised object).

• This reply was modified 4 years, 5 months ago by Aurovrata Venet.

Is it possible (if so, how) to insert several maps in the form?

I just released v1.7 with a multi-maps in a form enabled.

Fantastic. I love it, but now I have a little problem with “user input address”.
In my form I have:

[map destiny-location custom_address "zoom:14;clat:49.98591598309408;clng:21.949909645507827;lat:49.986586;lng:21.949223"]
<p id="destadres">Adres [text destiny-address]</p>
</div>
<script type="text/javascript">
(function($){
$(document).ready( function(){
	$('.cf7-google-map-container.destiny-location').on('update.cf7-google-map', function(e){
	//the event has 5 address fields, e.address.line, e.address.city, e.address.pin, e.address.state, e.address.country.
	//some fields may be empty.
	$('p#destadres input').val(e.address.line + e.address.pin +' '+ e.address.city);
	})
})})(jQuery)
</script>

and few lines down is a second map:

[map current-location "zoom:15;clat:49.98986304426285;clng:21.952339743307892;lat:49.989093537451474;lng:21.952647882080072"]
<br>
<p id="curadres">Adres [text current-address]</p>
</div>
<script type="text/javascript">
(function($){
$(document).ready( function(){
	$('.cf7-google-map-container.current-location').on('update.cf7-google-map', function(e){
	//the event has 5 address fields, e.address.line, e.address.city, e.address.pin, e.address.state, e.address.country.
	//some fields may be empty.
	$('p#curadres input').val(e.address.line + e.address.pin +' '+ e.address.city);
	})
})})(jQuery)
</script>

I change ID for <p> (p#curadres) and for the map (cf7-google-map-container.current-location). For first map (destiny-location) it’s working perfect, but for “current-location” it not working, and I don’t know why. Can You tell me, what I do wrong? Sorry for my bad english.

— edit —
I found a small bug: if I have a two maps (as up: “destiny” and “current”) and I write address in first map, point is moved but map stay on last view. For the second map all work perfect.
Sorry for make a problems for You.

• This reply was modified 4 years, 5 months ago by tuomi90.
• This reply was modified 4 years, 5 months ago by tuomi90.

I found a couple of errors in the js script file which I fixed in v1.7.1

Please update and let me know if you are still facing an issue.

If you still have a problem, can you inspect your console and report any js errors

Centering map on the point work perfect. But “writing address” in input field not working good. Is it possible that “function(e)” in “$(‘.cf7-google-map-container.map-name’).on(‘update.cf7-google-map’, function(e){” make a trouble for multiple maps?
I tested it on one map and it perfect working.
But if I add second map (I change map name and input field ID), for the first map it working good, but when I set point on second map, address is not show in the input field. if You want, You can check it on fifitrans.rgtv.pl.
First map (which working) is under “Adres docelowy*” and second map (not working good) is under “Adres Twojego aktualnego pobytu”. Input fields is under of each maps.
— edit —
Maybe for every maps add an ID and for every “function(e)” add this id. Example: if ID is “map” – function(map_e). I know that its too much edit in plugin script for You, but I don’t have any ideas and knowledge of javascript for me is worst than my english .

• This reply was modified 4 years, 5 months ago by tuomi90.
• This reply was modified 4 years, 5 months ago by tuomi90.

I had a look at your page. Your 2nd field has not been parametrised to show addresses, hence the address update event is never fired on that field.

Check your map tag in your form and make sure you have the custom_address parameter in it.

I checked all, and should be working (I think).

Here You have a new code from my form (admin view):

<div>Adres <b><u>docelowy</u></b>*<br>
<!-- map for destination place -->
[map destiny-location custom_address "zoom:14;clat:49.98591598309408;clng:21.949909645507827;lat:49.986586;lng:21.949223"]
<!-- field & script for destination place -->
<p id="destadres">Adres [text destiny-address readonly "Adres miejsca docelowego (WYBIERZ Z MAPY)"]</p>
</div>
<script type="text/javascript">
(function($){
$(document).ready( function(){
$('.cf7-google-map-container.destiny-location').on('update.cf7-google-map', function(e){
//the event has 5 address fields, e.address.line, e.address.city, e.address.pin, e.address.state, e.address.country.
//some fields may be empty.
$('p#destadres input').val(e.address.line + e.address.pin +' '+ e.address.city);
})
})})(jQuery)
</script>
<div>Adres Twojego <b><u>aktualnego</u></b> pobytu
<small>(pozostaw puste, je?eli startujemy z bazy)</small>
<!-- map for current place -->
[map current-location "zoom:15;clat:49.98986304426285;clng:21.952339743307892;lat:49.989093537451474;lng:21.952647882080072"]
<!-- field & script for destination place -->
<p id="curradres">Adres [text current-address readonly "Lubomirskiego 54, 36-040, Boguchwa?a"]</p>
</div>
<script type="text/javascript">
(function($){
$(document).ready( function(){
$('.cf7-google-map-container.current-location').on('update.cf7-google-map', function(e){
//the event has 5 address fields, e.address.line, e.address.city, e.address.pin, e.address.state, e.address.country.
//some fields may be empty.
$('p#curradres input').val(e.address.line + e.address.pin +' '+ e.address.city);
})
})})(jQuery)
</script>

As You can see for destiny I have a correct data and it good working.
For current map & field I have a correct ID’s and parameters, but it’s not working.
At this moment it’s not important. My collegues must set locations on the map, so I have a long & lat from their’s positions ??

your destiny-location is configured to use GeoLocation services by enabling the search/use addresses and opting for the custom address fields,

[map destiny-location custom_address “zoom:14;clat:49.98591598309408;clng:21.949909645507827;lat:49.986586;lng:21.949223”]

but not your current-location field,

[map current-location “zoom:15;clat:49.98986304426285;clng:21.952339743307892;lat:49.989093537451474;lng:21.952647882080072”]

you need to be more careful when you configure your map fields!

PS: you have a very long form, have you tried the Smart Grid-layout for CF7 plugin? It allows you to build responsive forms in a grid layout, making your forms much more compact and smart.

OMG… :facepalm: now I see my mistake. Thank You very much. Your’e the best plugin maker for me ?? You are very very helpful for guys who use Your plugins. Yes, I use SGl. It’s very helpful plugin for create forms, but I see a little trouble. If I use this plugin, I cannot use JavaScript in the forms, because it’s not working correctly. (It od possible that I use this plugin in a wrong way.)

I cannot use JavaScript in the forms,

indeed, because this is not the correct way to include js. The Smart Grid-layout plugin will automatically look for a custom js file in your theme folder.

If your form unique key (slug) is destination-form, then simply create the following file in your theme folder,

js/destination-form.js

the file is placed in the subfolder /js.

The plugin will automatically load this file only in the pages where that form is dispayed. This will make it much easier also to debug your js. The same logic also applies for the custom css files (see the plugin FAQ for more details)

Thank You very much. Your’e the best plugin maker for me

you’re welcome! Maybe worth a couple of coffees or beers?