ページでデータが更新されない

Question

JSを使用してGoogleマップに次のコードをロードしています。

$(document).ready(function(){ 
    $('.acf-map').each(function(){ 
    map = new_map($(this)); 
    }); 
    var geocoder = new google.maps.Geocoder(); 
    document.getElementById('submit').addEventListener('click', function() { 
    geocodeAddress(geocoder, map); 
    location.reload(); 
    }); 

}）;

Iマップを作成だし、PHP

<div class="acf-map"> 
    <?php $custom = new WP_Query(array(
     'post_type'   => 'centre', 
     'posts_per_page' => -1 

    )); ?> 
    <?php 
    if ($custom->have_posts()) { 
     while ($custom->have_posts()) { 
      $custom->the_post(); ?> 
      <?php $location = get_field('centre_location'); ?> 

      <div class="marker" data-lat="<?php echo $location['lat'] ?>" data-lng="<?php echo $location['lng']; ?>" style="border: 5px solid grey;"> 
       <a href="<?= the_permalink() ?>"><h5 class="orange"><?= get_field('centre_name'); ?></h5></a> 
       <p class="address"><?php echo get_field('centre_address') ?></p> 
       <p class="orange">Call us at <a href="tel: <?= get_field('centre_telephone_number'); ?>"><?= get_field('centre_telephone_number'); ?></a></p> 

      </div> 

      <?php 
     } 
     wp_reset_postdata(); 
    } 
    ?> 
</div> 

を用いてマーカーはその後、私は、ユーザからの入力を取得し、データベースにプッシュすることをデコードです。

<input type="text" placeholder="Enter your postcode" class="orange find input" id="address"> 
<button id="submit" class="find sub orange">Search</button> 

function geocodeAddress(geocoder, resultsMap) { 
    var address = document.getElementById('address').value; 
    geocoder.geocode({'address': address}, function(results, status) { 
    if (status === 'OK') { 
     resultsMap.setCenter(results[0].geometry.location); 
     var lat = results[0].geometry.location.lat(); 
     var lng = results[0].geometry.location.lng(); 
     $.ajax({ 
     url: "../link/to/post.php", 
     type: "POST", 
     data : { 
      lat: lat, 
      lng: lng 
     } 
     }); 
     var marker = new google.maps.Marker({ 
     map: resultsMap, 
     position: results[0].geometry.location, 
     title: 'Your location' 
     }); 
    } 
    }); 
} 

データは必要に応じてデータベースにプッシュされ、追加コードが必要になり、マーカーが追加されます。ただし、ページがリフレッシュされると、データベース内のデータがすぐに挿入されても、新しいデータを取得するために別のリフレッシュが必要になります。

私はさまざまなリフレッシュを試みましたが、どれも問題を修正しませんでした。

私の解決策の1つは、ページを2回リフレッシュする方法を見つけることでしたが、何百ものマーカーをロードする必要があるため、効率的ではありませんでした。

Answer 1

私は私の質問に答えました。

問題は、私が推測していることから、SQLクエリがページが更新されるよりも遅く実行されていることでした。

修正するために、私は遅延を追加しました。