当前位置: 首页 > 面试题库 >

使用AJAX刷新Django动态HTML表

澹台建华
2023-03-14
问题内容

首先,我是Django的新手,几乎完全不熟悉AJAX和jQuery。 我在本地开发。

因此,我正在尝试实现一个HTML表,该表在AJAX的帮助下每X秒钟动态刷新一次(无需页面刷新),但是我似乎无法使我的代码正常工作。

(如果我有足够的代表,我可能会回答这个问题,或者从聊天中寻求帮助,但我还没有那么高兴)

我一直在努力使它工作10多个小时,而我开始感到无助。我一直在疯狂地搜索网络,但是这样做的各种方式让我不知所措,每个问题和答案似乎都已经存在多年了,或者与我的应用程序无关。

此刻,该表对于第一个查询正常工作,它显示的对象Kala的rivinumero = 1(英语行数)。

所以,我有几个问题。

  • 我应该将脚本包含在其自己的单独文件中,而不是包含在HTML文件中(在我的情况下为displaykala.html)。如果是这样,该文件应该在static / js文件夹中还是其他位置?
  • 为了使脚本正常工作,我是否需要在其他地方单独包含AJAX / JS?
  • 我是否明显做错了,还是我提供的问题的答案有误?

displaykala.html(脚本位于同一文件中)

{% load static %}
{% include 'loginbar.html' %}
{% include 'nav.html' %}
<html>
    <head>
        <title>Display</title>
        <link rel="stylesheet" type="text/css" href="{% get_static_prefix %}css/style.css">
    </head>
    <body>
            <h1>Display</h1>
            <table id="_appendHere" class="table table-striped table-condensed">
                        <tr>
                          <th>Id</th>
                          <th>Nimi</th>
                          <th>Latnimi</th>
                        </tr>
                        {% for kala in kalat %}
                        <tr>
                          <td>{{kala.rivinro}}</td>
                          <td>{{kala.tuote}}</td>
                          <td>{{kala.latinalainen_nimi}}</td>
                        </tr>
                        {% endfor %}
                      </table>
    </body>
</html>

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

get_more_tables.html

{% load static %}
{% for kala in kalat %}
<tr>
   <td>{{ kala.rivinro }}</td>
   <td>{{ kala.tuote }}</td>
   <td>{{ kala.latinalainen_nimi }}</td>
</tr>
{% endfor %}

views.py

from django.shortcuts import render
from adminside.models import Kala
from adminside.models import Liha
from django.contrib.auth.decorators import login_required
# Create your views here.

def index(request):
    return HttpResponse("Index")

@login_required
def displaykala(request):
    kalat = Kala.objects.filter(rivinro=1)
    return render(request, 'displaykala.html', {'kalat': kalat})

@login_required
def get_more_tables(request):
    increment = int(request.GET['increment'])
    increment_to = increment + 10
    kalat = Kala.objects.filter(rivinro=2)[increment:increment_to]
    return render(request, 'get_more_tables.html', {'kalat': kalat})

urls.py(应用文件夹中的一个)

urlpatterns = [
    url(r'^$', views.index, name='index'),
    url(r'^displayk$', views.displaykala, name='displayk'),
    url(r'^get_more_tables', views.get_more_tables, name='get_more_tables'),
]

如果代码中出现“是的,我尝试过这种方式”这种愚蠢的实验,我感到很抱歉。


问题答案:

非常感谢@DanielRoseman。“您的JS将值发送为append_increment,但Python尝试访问增量。–“

我将相关行更改为,increment = int(request.GET.get('append_increment'))并修复了错误,现在该表正在动态更新。非常感谢您花费宝贵的时间。现在,我可以继续构建该应用程序!



 类似资料:
  • 问题内容: 我正在尝试使用AJAX和JQuery(在Django中)刷新页面的特定部分。如何获取仅重新显示div而不重新显示整个页面的信息。 这是我的看法。 当前,它将整个html页面放入#tag_page div中。我希望它用新的#tag_page div替换旧的#tag_page div。如果替换为它,则将整个页面刷新到应有的状态,但是我认为刷新整个页面是一种浪费。 如果有更好的方法,请告诉我

  • 问题内容: 所以@SOF 我一直在努力使我的学校成绩,成绩,预计成绩等网页具有自动更新功能,以便在通过使用和来获得新数据时刷新页面上的数据,并且“查看”。 我的主要问题是我无法正常使用任何形式的Ajax刷新/加载,我可以将输出生成为json或单个html文件,出于我的目的,我认为json会更好,但我不确定。 我的网页在左上角有一个导航助手,它是一个下拉菜单,该菜单通过“搜索”找到的列表填充,可以在

  • 本文向大家介绍在Laravel中实现使用AJAX动态刷新部分页面,包括了在Laravel中实现使用AJAX动态刷新部分页面的使用技巧和注意事项,需要的朋友参考一下 AJAX相信大家都不陌生,有很多不同的Javascript Frameworks可以用来快速实现AJAX功能。那么今天我们一起来看一下如何在使用了PHP Frameworks的网站中使用AJAX来刷新页面的一小部分。 这里我使用的是jQ

  • 问题内容: 这可能是一个简单的问题,但我很困惑,只是不知道从哪里开始。 我有一个PHP脚本(image_feed.php),该脚本返回图像的URL。每次调用此UR1时,它都会返回可用的最新图像(该图像每隔几秒钟更改一次)。 我想发生的是,当页面加载时,有一个对image_feed.php的AJAX调用,该调用返回了最新的URL。然后将该UR1插入HTM1,以替换适当的图像src。 5秒后,我希望重

  • 问题内容: 我是django的新手。我需要简单的例子。如何使用Django,Ajax,jQuery提交表单(发布)而不刷新页面? 这是我的表单,视图和模板: views.py forms.py(使用“ ModelForm”的表单) 模板(表单html代码) 问题答案: 如果您打算将ajax提交与jquery一起使用,则不应从视图中返回html。我建议您改为这样做: 的HTML: js views.

  • 问题内容: 我想使用Ajax更新MVC中的表格。我已经使用ajax在数据库中插入了数据。我只想在插入新行后更新表。 PS。我尝试搜索,但没有任何帮助,我仍然感到困惑。 用于插入新记录的Ajax代码: 问题答案: 您可以创建一个操作方法,该方法返回呈现表所需的HTML标记。让我们创建一个视图模型,通过该模型我们将传递表数据。 现在,在您的操作方法中,从表中获取数据,加载到我们的视图模型类的列表中并发