как получить предложение автоматической локализации goecode для показа внутри модального

Question

В настоящее время у меня появляется модальное окно, которое предлагает этому пользователю ввести адрес доставки.Автолокация работает, но она показывает за пределами модальной.Например вот изображение -> введите описание изображения здесь

<div class="panel panel-default">
    <div class="panel-body form-group">
        <%= form_for([@product, @product.orders.new]) do |f| %>
        <button class="btn btn-primary" data-toggle="modal" data-target="#place-order">Place Order</button>

        <div id="place-order" class="modal fade" role="dialog">
          <div class="modal-dialog">
            <div class="modal-content">             
                <div class="modal-header">
                  <button class="close" data-dismiss="modal">&times;</button>
                  <h4 class="modal-title">Lets Get some Info</h4>
                </div>
                <div class="modal-body">              
                    <div class="form-group">
                        <label>Delivery Address</label>
                      <%= f.text_field :delivery_address, placeholder: "Where do you want this delivered?", class: "form-control", required: true, id: "orderdelivery" %>
                    </div>
                    <div class="text-center">
                      <%= f.submit "Place Order", class: "btn btn-primary" %>
                    </div>
                </div>
            </div>
          </div>
        </div>
        <% end %>
    </div>
</div>


<script>
    $(function() {
    $("#orderdelivery").geocomplete();
  })
</script>