Flask Dinamik veri güncelleme i Google gibi bir şey yaratmak için çalışıyorum

Ben girdi değişiklikleri dinliyorumFlask Dinamik veri güncelleme i Google gibi bir şey yaratmak için çalışıyorum

, (api http://suggestqueries.google.com/complete/search?output=toolbar&hl=ru&q=query önermek yoluyla) ve gönderme veri gitmek Aracı öner GET:

$("#search_form_input").keyup(function(){ 
var some_var = $(this).val(); 
    $.ajax({ 
     url: "", 
     type: "get", //send it through get method 
     data:{jsdata: some_var}, 
     success: function(response) { 

     }, 
     error: function(xhr) { 
     //Do Something to handle error 
     } 
    });

Bundan sonra

ben bu verilerin işlenmesi ve Google API göndermek ve Python yanıt aldı ediyorum: Jinja olarak

@app.route('/', methods=['GET', 'POST']) 
def start_page_data(): 
    query_for_suggest = request.args.get('jsdata') 

    if query_for_suggest == None: 
     suggestions_list = ['',] 
     pass 
    else: 
     suggestions_list = [] 
     r = requests.get('http://suggestqueries.google.com/complete/search?output=toolbar&hl=ru&q={}&gl=in'.format(query_for_suggest), 'lxml') 
     soup = BeautifulSoup(r.content) 
     suggestions = soup.find_all('suggestion') 
     for suggestion in suggestions: 
      suggestions_list.append(suggestion.attrs['data']) 
     print(suggestions_list) 
    return render_template('start_page.html', suggestions_list=suggestions_list)

dinamik HTML olarak yazdırmaya çalışırken:

 <label id="value_lable"> 


      {% for suggestion in suggestions_list %} 
       {{ suggestion }} 
      {% endfor %} 

     </label>

Ancak Jinja'daki değişken dinamik olarak güncellenmiyor ve boş liste yazdırılıyor.

HTML'den dinamik olarak öneriler listeden nasıl yazdırılır?

kaynak

2016-12-04 Konstantin Rusanov

sizin 'başarı:' işlevi boş Yani Flask'tan veri ile hiçbir şey yapmıyorsunuz. – furas

Düzeltmek için neye ihtiyacım var? –

AJAX/JavaScript'in nasıl çalıştığını bilmiyorum. JavaScript Flask'a veri gönderir, Flask bazı verileri geri gönderir - JSON kadar iyi - ve JavaScript bu verileri alır ve tarayıcıda HTML'i günceller. – furas

Çalışma örneği:

app.py

from flask import Flask, render_template, request 
import requests 
from bs4 import BeautifulSoup 


app = Flask(__name__) 


@app.route('/') 
def index(): 
    return render_template('index.html') 


@app.route('/suggestions') 
def suggestions(): 
    text = request.args.get('jsdata') 

    suggestions_list = [] 

    if text: 
     r = requests.get('http://suggestqueries.google.com/complete/search?output=toolbar&hl=ru&q={}&gl=in'.format(text)) 

     soup = BeautifulSoup(r.content, 'lxml') 

     suggestions = soup.find_all('suggestion') 

     for suggestion in suggestions: 
      suggestions_list.append(suggestion.attrs['data']) 

     #print(suggestions_list) 

    return render_template('suggestions.html', suggestions=suggestions_list) 


if __name__ == '__main__': 
    app.run(debug=True)

index.html JavaScript içinde

<!DOCTYPE html> 

<html> 

<head> 
    <title>Suggestions</title> 
</head> 

<body> 

Search: <input type="text" id="search_form_input"></input> 

<div id="place_for_suggestions"></div> 

<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script> 

<script> 
$("#search_form_input").keyup(function(){ 
    var text = $(this).val(); 

    $.ajax({ 
     url: "/suggestions", 
     type: "get", 
     data: {jsdata: text}, 
     success: function(response) { 
     $("#place_for_suggestions").html(response); 
     }, 
     error: function(xhr) { 
     //Do Something to handle error 
     } 
    }); 
}); 
</script> 

</body> 

</html>

suggestions.html

<label id="value_lable"> 
    {% for suggestion in suggestions %} 
     {{ suggestion }}<br> 
    {% endfor %} 
</label>

kaynak

2016-12-04 21:49:09 furas

Benim için çalışıyor. Teşekkürler! –

Bu güvenli kabul edilir mi? Birisi sadece https: //.../suggestions adresine gidebilir ve bir sayfa döndürür. Çağrı AJAX isteğinden gelmediği sürece, oluşturulan şablonu döndürmeyi engelleyebilmemizin bir yolu var mı? – Mike

Harika çalışıyor, teşekkürler. Ek javascript içeren bir HTML (örneğin, öneri.html) yüklemeye çalıştığımda bir sorunla karşılaştım, bunu nasıl ele alabilirim? – user1265067

Flask Dinamik veri güncelleme i Google gibi bir şey yaratmak için çalışıyorum

cevap

İlgili konular