Estoy usando el autocompletado de Google dentro de un modal. Cuando hago clic en el campo de entrada, se muestran los resultados detrás del modal. No utilicé ningún CSS. Funciona perfecto fuera del modal. Pero no funciona bien dentro del modal. Por favor, ayúdame.

Código HTML

<div class="form-group">
    <p class="control-label1">City</p>
    <input type="text" id="locationTextField" placeholder="" name="city" class="form-control">
</div>

Código Javascript

//Google Map
function initialize() {
    var input = document.getElementById('locationTextField');
    var autocomplete = new google.maps.places.Autocomplete(input);
}

function validateCity() {
    searchfield = $('#locationTextField').val();
    if (searchfield == "" || searchfield == null) {
        return false;
    }
    else {
        $('#locationTextField').val('');
        return false;
    }
}
google.maps.event.addDomListener(window, 'load', initialize);
1
user7152572 13 dic. 2016 a las 14:47
¿Puede proporcionar su código html?
 – 
RonyLoud
13 dic. 2016 a las 14:50
Encontré la respuesta.
 – 
user7152572
13 dic. 2016 a las 14:55

1 respuesta

La mejor respuesta

Encontré la respuesta agregando el siguiente código dentro de css

div.pac-container {
   z-index: 1050 !important;
}
6
user7152572 13 dic. 2016 a las 14:50
Muy fácil de arreglar, buena respuesta.
 – 
Deepak Dholiyan
28 mar. 2018 a las 18:20
Bienvenido @DeepakDholiyan :)
 – 
user7152572
10 abr. 2018 a las 15:31