www.webdeveloper.com
Results 1 to 2 of 2

Thread: Help with Google Map

  1. #1
    Join Date
    Aug 2014
    Posts
    1

    Help with Google Map

    Coult somebody help me with that? I woult like to create a textfield where you can type a city, and then it should open a new page with google maps of the entred city. I've made it with a hidden Submit-Button, but it doesn't open when you press enter...
    Thank you very much!

    Code:
    <script type="text/javascript">
    
     function open_win()
     {
     window.open ("https://www.google.ch/maps?q=" + suche.value)
     }
     </script>
    Code:
    <input name="suche" type="text" style="width: 90px)"  value="" onclick="this.value='';" />
    
    
    
    <input type="submit" id="search" value="Submit" onclick="open_win()"  />
    Code:
    <style type="text/css">
        input#search
        {
    
        border: none;
        width: 0;
        padding: 0;
     
        }
    </style>
    Last edited by jedaisoul; 08-16-2014 at 12:06 PM. Reason: code tag added

  2. #2
    Join Date
    Oct 2013
    Posts
    614
    You haven't defined "suche", either with an ID in the INPUT nor as a variable in your script. However, I prefer to pass that information from the form to the script. Try this:
    HTML Code:
    <!DOCTYPE html>
    <html>
       <head>
          <meta charset="utf-8">
          <title>map form</title>
    	<script>
    	function open_win(city){
    		window.open ("https://www.google.ch/maps?q=" + city)
    	}
    	</script>
    	<style>
    	input#search {
    		border: none;
    		width: 0;
    		padding: 0;
    	}
    	</style>
       </head>
       <body>
          <form>
            <input name="suche" id="suche" type="text" style="width: 90px;" value="" onclick="this.value='';">
    	<input type="submit" id="search" value="Submit" onclick="open_win(suche.value)">
          </form>
       </body>
    </html>

Thread Information

Users Browsing this Thread

There are currently 1 users browsing this thread. (0 members and 1 guests)

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •  
HTML5 Development Center



Recent Articles