Listening for the domready event for google.maps.InfoWindow class

So, I am trying to make add a google map to my webpage. I want to add a form into the pop-up bubble when you click on a marker on the map.

The API documentation says that the domready

"event is fired when the containing the InfoWindow's content is attached to t开发者_JS百科he DOM. You may wish to monitor this event if you are building out your info window content dynamically."

How do I listen to this event?

This is the documentation.

I just solved a similar problem myself. To listen for the domready event, use the following syntax:

infoWindow = new google.maps.InfoWindow();
google.maps.event.addListener(infoWindow, 'domready', function() {
      // whatever you want to do once the DOM is ready
});

The google.maps.event.addListener() event waits for the creation of the infowindow HTML structure 'domready' and before the opening of the infowindow defined styles are applied.

I have worked with this example :

google.maps.event.addListener(infowindow, 'domready', function() {

   // Reference to the DIV which receives the contents of the infowindow using jQuery
   var iwOuter = $('.gm-style-iw');
   var iwBackground = iwOuter.prev();

   // Remove the background shadow DIV
   iwBackground.children(':nth-child(2)').css({'display' : 'none'});

   // Remove the white background DIV
   iwBackground.children(':nth-child(4)').css({'display' : 'none'});

});

Then

.gm-style-iw {
   width: 350px !important;
   top: 0 !important;
   left: 0 !important;
   background-color: #fff;
   box-shadow: 0 1px 6px rgba(178, 178, 178, 0.6);
   border: 1px solid rgba(72, 181, 233, 0.6);
   border-radius: 2px 2px 0 0;
}

Result :

Reference : http://en.marnoto.com/2014/09/5-formas-de-personalizar-infowindow.html

Thanks

var contentString = 'your form here';

var infowindow = new google.maps.InfoWindow({
    content: contentString
});

var marker = new google.maps.Marker({
    position: myLatlng,
    map: map,
    title:"My Form"
});

google.maps.event.addListener(marker, 'click', function() {
  infowindow.open(map,marker);
});