Есть ли способ добавить результат ответа ajax в адрес карты Google? используя Ajax - PullRequest
0 голосов
/ 02 июля 2019

У меня проблема с добавлением результата ответа к адресу карты Google, который показывает, что геокод не был успешным по следующей причине: INVALID_REQUEST.У меня есть скрытое текстовое поле, в которое я добавляю результат ответа адреса клиента.поэтому у каждого клиента свой адрес, поэтому, если я нажму кнопку действия, я хочу показать карту Google на модальной начальной загрузке, где маркер указывает на местоположение клиента.ниже я покажу вам, ребята, коды, которые я уже сделал.

delivery_order_reports.php

<div class="table-responsive" style="">
      <table id="tables_customer_details" class="table table-striped" style="width:100%;">
          <thead style="background-color:white !important; border-style:hidden !important;">
              <tr style=" font-size: 14px; ">
                  <th>ID</th>
                  <th scope="col">Customer Name</th>
                  <th scope="col">Customer Number</th>
                  <th scope="col">Customer Address</th>
                  <th scope="col">Customer Email</th>
                  <th scope="col">Customer Store</th>
                  <th scope="col">Action</th>
              </tr>
          </thead>
          <tbody style=" font-size:14px;">
            @if(Auth::user())
              @foreach($customer_full_details as $detail)
                <tr>
                      <td>{{$detail->customer_id}}</td>
                      <td>{{$detail->customer_name}}</td>
                      <td>{{$detail->customer_number}}</td>
                      <td>{{$detail->customer_address}}</td>
                      <td>{{$detail->customer_email}}</td>
                      <td>{{$detail->customer_location}}</td>
                       <td><center><button data-toggle="modal" data-target="#getReportOrder" class="btn btn-primary report_order_report"  report-data-order-id='{{$detail->order_id}}'  href="#" style="color:white;"><i class="fas fa-eye"></i></button></center></td>
                  </tr>
              @endforeach
            @endif
          </tbody>
      </table>
  </div>

<script>
  var customer_add = document.getElementsByClassName("hidden_customer_address").value;

  var geocoder;
  var map;
  var address = customer_add;

  function initMap() {
    var map = new google.maps.Map(document.getElementById('map'), {
      zoom: 8,
      center: {lat: -34.397, lng: 150.644}
    });
    geocoder = new google.maps.Geocoder();
    codeAddress(geocoder, map);
  }

  function codeAddress(geocoder, map) {
    geocoder.geocode({'address': address}, function(results, status) {
      if (status === 'OK') {
        map.setCenter(results[0].geometry.location);
        var marker = new google.maps.Marker({
          map: map,
          position: results[0].geometry.location
        });
      } else {
        alert('Geocode was not successful for the following reason: ' + status);
      }
    });
  }

Front End

    $(document).ready(function(){
  $('.report_order_report').click(function(){
      var report_data_order_id = $(this).attr('report-data-order-id');
      $.ajax({
        url: '/get_report_customer_order',
        type: 'GET',
        dataType: 'JSON',
        data: { order_id: report_data_order_id },
        success: function (response) {
          console.log(response);
          const amount = response[0].amount;
          const customer_name = response[0].customer_name;
          const customer_number = response[0].customer_number;
          const delivery_status = response[0].delivery_status;
          const order_date = response[0].order_date;
          const order_address = response[0].order_ship_address;
          const transaction_number = response[0].transaction_number;
          const customer_km = response[0].customer_km;

          $('.hidden_customer_address').val(order_address);

          $('label.report_order_detail_customer_name').html(customer_name);
          $('label.report_order_detail_customer_address').html(order_address);
          $('label.report_order_detail_customer_transac_number').html(transaction_number);
          $('label.report_order_detail_customer_order_date_time').html(order_date);
          $('label.report_order_detail_customer_km').html(customer_km);
          $('label.report_order_detail_customer_total_costs').html(amount);

        }
      })
  });
})
Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...