Flask: Mise à jour du modèle avec données côté client

Question

Je travaille sur un projet dans lequel l'utilisateur affiche une liste par défaut de restaurants (objs de repos) lorsqu'ils visitent une URL. Si l'utilisateur choisit de soumettre sa position à l'aide de la fonction de géolocalisation HTML5, je souhaite mettre à jour la liste de résultats pour la classer par proximité de l'emplacement de l'utilisateur.

Le modèle initial s'affiche correctement et je peux récupérer les données sur le serveur. Je ne peux simplement pas effectuer de nouveau le rendu du modèle. Lorsque je prévisualiser la réponse à mon message client dans la console de développement, les données sont mises à jour, mais quand je vais à la page, rien n'a changé. Je sais que je fais probablement une erreur évidente idiote, je ne sais pas ce que c'est.

Voici mon avis:

def home(): 
    if request.method == 'POST': 
     lat = request.form.get('lat','') 
     lng = request.form.get('lng','') 
     query = loc_query(lat,lng,10,0,20) 
     rests = Rest.query.from_statement(query).all() 
     return render_template('main.html',rests = rests) 
    else: 
     rests = getLatest(5)#Get 5 random rest objects 
     return render_template('main.html',rests = rests) 

Et voici mon script client:

<script type="text/javascript"> 
    function sendloco (loc) { 

     $.post('/latest',{lat:loc.coords.latitude,lng:loc.coords.longitude}, 
      function(data){ 
       $('#restlist').html(data); 
      });     
    }; 

    navigator.geolocation.getCurrentPosition(sendloco); 
</script> 

Et voici la partie pertinente de mon modèle:

<div class="col-lg-12" id="restlist"> 

     {% for rest in rests %} 
      <h2><b><a href="{{ url_for('profile',id=rest.id)}}">{{ rest.name }}</a></b></h2> 
      <h3>Date:{{ rest.latestDt() }}</h3> 
      <h3>{{ rest.street }}</h3> 
     {% endfor %} 
    </div> 

thansk fo la Aidez-moi!

Answer 1

On dirait que vous appelez $('.restlist').html(data) mais en html votre div a id="restlist" pas classe. Peut-être essayer $('#restlist').html(data).