Reload-Tabelle Daten in Django, ohne die Seite aktualisieren

Den code, um die Daten in mein view sieht wie folgt aus:

order = Order.objects.filter(owner=request.user).order_by('-id')[:10]

Den code in mein template sieht wie folgt aus und funktioniert Super. Nun, die Sache ist, dass ich diese Tabelle zu aktualisieren, seine Informationen alle 10 Sekunden, ohne die gesamte Seite aktualisiert wird. Die url, um die Ansicht /und der name der Vorlage ist zu Hause.

           <table class="table table-striped table-condensed">
              <tr>
                <th>Reg.nr.</th>
                <th>M&auml;rke</th>
                <th>Modell</th>
              </tr>
              {% for i in order %}

                {% if i.order_booked %}
                <tr class="success">
                {% else %}
                <tr>                    
                {% endif %}

                 <td>{{ i.regnr|upper }}</td>
                 <td>{{ i.brand|capfirst }}</td>
                 <td>{{ i.brand_model|capfirst }}</td>
              </tr>
              {% endfor %}
            </table>

urls.py sieht so aus

urlpatterns = [ url(r'^$',views.home, name='home'), url(r'^login/', auth_views.login, {'template_name':'login.html'}, name='account_login'), url(r'^logout/', auth_views.logout, {'template_name':'logout.html'},name='account_logout'), url(r'^add_order/', views.add_order, name='add_order'), url(r'^admin/', admin.site.urls), ]

Kann mir jemand von Euch etwas Aufschluss über diese würde ich sehr zu schätzen wissen!

Sie müssen javascript verwendet. Es ist der einzige Weg zur Veränderung des dom-Objekte, ohne die Seite aktualisieren.
Ok, im gut mit mit javascript. Aber ich habe keine Ahnung, wie es getan werden sollte, ich habe versucht, Dutzende von Skripten, um zu versuchen, um es zu arbeiten. Haben Sie Erfahrung in js mit django und nun, wie bekommen es zu tun? Wie bekomme ich die neuen Daten aus der Ansicht, ohne die gesamte Seite aktualisiert wird?
Es ist wirklich schwer, jemanden von stackoverflow code zu schreiben für Sie. Einfach googeln, so etwas wie "django javascript" würde Ihnen Tonnen von Ergebnissen. Ich habe gerade zufällig eine auswählen, die sieht vielversprechend aus tangowithdjango.com/book/chapters/ajax.html

InformationsquelleAutor Likk0s | 2016-01-13

  1. 12

    Können Sie setInterval, jQuery AJAX, und ein view:

    Ihre HTML -

       <table id="_appendHere" class="table table-striped table-condensed">
      <tr>
        <th>Reg.nr.</th>
        <th>M&auml;rke</th>
        <th>Modell</th>
      </tr>
      {% for i in order %}
        {% if i.order_booked %}
        <tr class="success">
        {% else %}
        <tr>                    
        {% endif %}

         <td>{{ i.regnr|upper }}</td>
         <td>{{ i.brand|capfirst }}</td>
         <td>{{ i.brand_model|capfirst }}</td>
      </tr>
      {% endfor %}
    </table>

    JS

    <script>
    var append_increment = 0;
    setInterval(function() {
        $.ajax({
            type: "GET",
            url: {% url 'get_more_tables' %},  //URL to your view that serves new info
            data: {'append_increment': append_increment}
        })
        .done(function(response) {
            $('#_appendHere').append(response);
            append_increment += 10;
        });
    }, 10000)
</script>

    Ansicht

    def get_more_tables(request):
    increment = int(request.GET['append_increment'])
    increment_to = increment + 10
    order = Order.objects.filter(owner=request.user).order_by('-id')[increment:increment_to]
    return render(request, 'get_more_tables.html', {'order': order})

    get_more_tables.html

      {% for i in order %}
  <tr>
    {% if i.order_booked %}
    <tr class="success">
    {% else %}
    <tr>                    
    {% endif %}

     <td>{{ i.regnr|upper }}</td>
     <td>{{ i.brand|capfirst }}</td>
     <td>{{ i.brand_model|capfirst }}</td>
  </tr>
  {% endfor %}

    Und dann nur stellen Sie sicher, dass Sie die neue Ansicht in Ihr urls.py (stellen Sie sicher, es hat name='get_more_tables' oder wie auch immer der name ist in deinem JS url:)

    Was dieser tut, ist die Verwendung setInterval eine JS-Funktion, um eine GET AJAX-request alle 10000ms (10 Sekunden), um einen Blick in Ihre server. Die Ansicht stellt dann eine separate HTML-Datei mit dieser neuen Kontext, und sendet Sie als ein response zurück zu Ihrem ursprünglichen HTML-Seite. Die neue response ist dann appended via jQuery auf Ihren Tisch. Jedes mal, wenn dieser Zyklus passiert, die Scheibe wird erhöht, so dass Sie don ' T erhalten die gleichen Ergebnisse aus Order.

    Beachten Sie, dass diese Schleife nicht beenden, so dass, wenn Sie es beenden wollen müssen Sie code hinzufügen, um den JS zu stoppen setInterval wenn die Letzte Antwort kam zurück, leer.

    Vielen Dank für Ihre Antwort, ich werde es ausprobieren. Es machte mich besser zu verstehen, was gebraucht wird. Vielen Dank.
    Kein problem, wenn die Lösung funktioniert für Sie, klicken Sie auf den grünen "check" - Markierung Links von meiner Antwort so, dass wer Hilfe braucht, wird die Antwort kennen
    Stellen Sie Ihre aktuellen urls.py in deinem ursprünglichen post und ich werde es hinzufügen
    Vielen Dank für den code, Hybrid, jetzt funktioniert es wie ein Charme. Sie wirklich meinen Tag verbrachte ich so viele Stunden versucht, diese Arbeit heraus.

    InformationsquelleAutor Hybrid

Schreibe einen Kommentar