Forum | Appery.io

Hi There,
I'd like to set focus() to a google map.
i checked and got the
document.getElementById("myAnchor").focus();

i tried the .focus() method att'd to Appery("googlemapName").focus();
but didn't work.
how would you do ?

thk you
Eric

not really sure why you'd need to set the focus on the map - unless you have some input element on it, or you need it to be able to respond to some keys / buttons without the user having to tap on the map.

A few ways to set the focus are:
One of them may work

code
$('#yourGmapID').focus();
/code

code
// Set focus on the first element of the class
$('.yourGmapClass:first').focus();
/code

code
var mymap = Apperyio('gmap_name');
mymap.focus();
/code

code
Appery("googlemap_1").focus();
// OR
var myMap = jQuery('[name="googlemap_1"]');
myMap.focus();
/code

Hello Eric.

I gmap component doesn't have focus event, you can only emulate this state, but extra logic
1) add js file
2) add
var Helper = {
gmapFocused: false
};

3) on gmap component click
Helper.gmapFocused = true;

At this point you can check if gmap was clicked and gained focus.

4) add on mouse event handler
Helper.gmapFocused = false;

Hi There, you got it. I hv a sliding up buttons that leaves a white strip. I'll try .focus() to make it nicer than having the user to tap on the map.
Thks, I'll try your advice. Eric

Thks Egor. I'll try this too.

Hi There, I still hv trouble with a map after header slides up.
here after are the steps.
any idea ?
thk you very much in advance
Eric

Hi Eric ,

It's hard to say why you have this empty space.

Please specify:
1 How do you show this header(with buttons).
2 How do you hide this header(with buttons).
3 Public link and steps to reproduce this issue.

Thanks.

Hi Yurii, thks for taking care of this.
it's not critical but maybe it's not much to find why. it doesn't do so on the browser mobile viewer. the strip appears on both of my devices Android 4.4.2 and 4.4.4.

here are the steps:
1/ app name : toopeewapp
2/ login : appery
pw : appery
appNum : 10
3/ check 'accept conditions ...'
4/ on startScreen = important ! tap on the top illustration with green bills. the panel will open and the gmap will set your address' latLng to storage.
5/ then you close the panel by tapping onto the same green bills
6/ back to startScreen, press Geolocation button
7/ on gmap press any of the markers but the red (bouncing)
8/ an infowindow will open and the header's buttons will slideDown
9/ when you close the infowindow, the buttons slideUp ... and the white strip appears.

as for the related JS, pls go to JS sheet "Geolocation_code"
here in the function setAllUsersMarkers().

thks for giving a look at it
Eric

Hi Yurii, I don't know if something was done, or it's after rearranging my code that the slideDown operates differently ... whatever, I don't hv the strip any more. hope it will last no need to spend more time on this. thk you