Kolben Dynamischen Daten aktualisieren ohne die Seite neu laden

ich versuche etwas zu schaffen, wie Google Suggest-Tool (via suggest api http://suggestqueries.google.com/complete/search?output=toolbar&hl=ru&q=Abfrage )

Höre ich Eingangs ändert, und senden die Daten HOLEN:

$("#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
      }
    });

Nach, dass ich die Handhabung dieser Daten und sendet diese an die Google API und bekam Antwort in Python:

@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)

In Jinja zu drucken versuchen, ist es in HTML dynamisch:

        <label id="value_lable">


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

        </label>

Aber die Variablen in Jinja nicht dynamisch aktualisieren und drucken leere Liste.

Wie print-Vorschläge aus der Liste dynamisch in HTML?

  • in JavaScript Ihrem success: Funktion ist leer, also Mach dir nix mit Daten aus der Flasche.
  • Was ich brauche, um zu beheben?
  • Ich denke, dass Sie nicht wissen, wie AJAX/JavaScript arbeiten. JavaScript sendet die Daten zu Kolben, Kolben zurück sendet einige Daten - besser als JSON - und JavaScript empfängt diese Daten und updates HTML im browser.
  • Können Sie uns einige Beispiele von, wie kann der Umgang mit diesem?
  • Ich success Funktion, die Sie haben zu finden-element in HTML - mit $(...) - und dann können Sie diese aktualisieren - mit Daten, die Sie haben in response.
  • Ich würde den Einsatz in Kolben getrennt Funktion zum senden von Anregungen.
  • Update innerhalb tis success: function(response) {...} ? Wie kann ich Daten empfangen (Liste der Vorschläge) - von der python-app?
  • success: function(response) hat Anregungen in Variablen response
  • wenn ich versuche, dein google-link direkt im browser, dann gibt es mir eine leere Seite. Ich erwarte, dass es gibt Daten als JSON, so dass Ihr JavaScript könnte es erhalten direkt - ohne Flasche - und zur Erzeugung von HTML auf der Seite.
  • XML-Datei, nicht als JSON
  • Es reaturns leere Datei ist, vielleicht müssen Google-Konto und Google-Projekt mit eigenem API-key.
  • OK, ich musste verschiedene text-in-Abfrage für Vorschläge 🙂
  • Die Daten aus dieser Datei - kein problem (auf der server-Seite über Kolben), problem ist - dynamisch drucken von Kommentaren im HTML-Format (nach Eingabe der einzelnen Buchstaben im Eingabefeld)
  • Kolben schicken sollte, nur minimale HTML mit Anregungen und sucess sollte den ie nutzen. $("#place_for_sugestions").html(response)

Schreibe einen Kommentar