I would like to let users fill in a form (which consists of a set of input boxes for username, password, birthdate, etc) and at the bottom of the page, the last input allows them to select their location on google maps (either automatically or manually). The problem occurs when user scrolls down to the bottom of the page where they see google map in a box. After they pin point their location, if they want to scroll back up in the page (for example to change the username they have already entered), they might have difficulty to do so, because when they put their finger on the screen and swipe down to go up in the page, it's google maps screen that moves, not the page! So they have to be careful not touch the map area to scroll up. How can I deal with this?


Use some form elements to interact with the map or use a button to confirm that the location selection is done so the interaction focus gets out of the map.

Here's Uber example - they do it well:

enter image description here


Place a small button/icon on the map that reads 'Go to top', this will take the focus away from map and users won't have a difficulty in scrolling.

  • 1
    you beat me to it :P Sep 21 '17 at 11:46
  • You mean I should open the map in a new window separate from where the form is filled?
    – B Faley
    Sep 21 '17 at 13:17
  • @Meysam Not needed. Just place a button on top of the map with absolute position.
    – Dipak
    Sep 21 '17 at 14:06
  • I think you are misunderstanding the "form" concept. Let me update my question to clarify.
    – B Faley
    Sep 22 '17 at 5:54
  • @Meysam check the update
    – Dipak
    Sep 22 '17 at 6:20

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.