title: Google Maps Asp.net with different automatic searchbox and different markers for them
body: <p><strong>Context:</strong> I am making a web application on <code>asp.net</code>, which have Google maps in it to search the location. I have 2 textboxes named <code>From</code> and <code>To</code> which works on autocomplete search. </p>
  
  <p><strong>The Problem:</strong> Only the <code>To</code> textbox is creating marker on the map but I want both the textboxes to create markers on 1 map only. Just to tell both textboxes are working with autocomplete search but marker is created only of the place searched by <code>To</code> textbox i.e., second one. </p>
  
  <p><strong>Additional Info:</strong> I don't want different markers for static latitude &amp; longitude. I want different markers based on the search in textboxes.</p>
  
  <p><strong>The Code:</strong></p>
  
  <pre><code>        &lt;script type="text/javascript" src="https://maps.googleapis.com/maps/api/js?v=3.exp&amp;libraries=places"&gt;&lt;/script&gt;
          &lt;script type="text/javascript"&gt;
              function LoadGoogleMAP() {
  
                  var markers = [];
                  var map = new google.maps.Map(document.getElementById('map'), {
                      mapTypeId: google.maps.MapTypeId.ROADMAP,
                      zoom: 8
  
                  });
  
                  var defaultBounds = new google.maps.LatLngBounds(
    new google.maps.LatLng(-33.8902, 151.1759),
    new google.maps.LatLng(-33.8474, 151.2631));
                  map.fitBounds(defaultBounds);
  
                  // Create the search box and link it to the UI element.  
  
                  var places = new google.maps.places.Autocomplete(document.getElementById('Text1'));
                  google.maps.event.addListener(places, 'place_changed', function () {
                      var place2 = places.getPlace();
                      var address = place2.formatted_address;
                      var latitude = place2.geometry.location.A;
                      var longitude = place2.geometry.location.F;
                      var mesg = "Address: " + address;
                      mesg += "\nLatitude: " + latitude;
                      mesg += "\nLongitude: " + longitude;
                      alert(mesg);
  
  
  
  
                      if (place2.length == 0) {
                          return;
                      }
                      for (var i = 0, marker; marker = markers[i]; i++) {
                          marker.setMap(null);
                      }
  
                      // For each place, get the icon, place name, and location.  
                      markers = [];
                      var bounds = new google.maps.LatLngBounds();
  
  
                      // Create a marker for each place.  
                      var marker = new google.maps.Marker({
                          map: map,
                          title: place2.name,
                          position: place2.geometry.location
                      });
  
                       markers.push(marker);
  
                      bounds.extend(place2.geometry.location);
  
                      map.fitBounds(bounds);
                  });
  
  
  
                  // current map's viewport.  
                  google.maps.event.addListener(map, 'bounds_changed', function () {
                      var bounds = map.getBounds();
                      place2.setBounds(bounds);
                  });
              }
  
              google.maps.event.addDomListener(window, 'load', LoadGoogleMAP); 
          &lt;/script&gt;
  
      //for second textBox named “To”
          &lt;script type="text/javascript"&gt;
              function LoadGoogleMAP1() {
  
                  var markers = [];
                  var map = new google.maps.Map(document.getElementById('map'), {
                      mapTypeId: google.maps.MapTypeId.ROADMAP,
                      zoom: 8
  
                  });
  
                  var defaultBounds = new google.maps.LatLngBounds(
    new google.maps.LatLng(-33.8902, 151.1759),
    new google.maps.LatLng(-33.8474, 151.2631));
                  map.fitBounds(defaultBounds);
  
  
                  var places = new google.maps.places.Autocomplete(document.getElementById('Text2'));
                  google.maps.event.addListener(places, 'place_changed', function () {
                      var place2 = places.getPlace();
                      var address = place2.formatted_address;
                      var latitude = place2.geometry.location.A;
                      var longitude = place2.geometry.location.F;
                      var mesg = "Address: " + address;
                      mesg += "\nLatitude: " + latitude;
                      mesg += "\nLongitude: " + longitude;
                      alert(mesg);
                      //});
  
  
  
                      if (place2.length == 0) {
                          return;
                      }
                      for (var i = 0, marker; marker = markers[i]; i++) {
                          marker.setMap(null);
                      }
  
                      // For each place, get the icon, place name, and location.  
                      markers = [];
                      var bounds = new google.maps.LatLngBounds();
  
  
                      // Create a marker for each place.  
                      var marker = new google.maps.Marker({
                          map: map,
                          title: place2.name,
                          position: place2.geometry.location
                      });
  
                      markers.push(marker);
  
                      bounds.extend(place2.geometry.location);
  
                      map.fitBounds(bounds);
                  });
  
  
  
                  // current map's viewport.  
                  google.maps.event.addListener(map, 'bounds_changed', function () {
                      var bounds = map.getBounds();
                      place2.setBounds(bounds);
                  });
              }
  
              google.maps.event.addDomListener(window, 'load', LoadGoogleMAP1); 
  
  
  
  
  
  
  
          &lt;/script&gt;
  </code></pre>