django通过jquery/json(复杂数据）/serializers（查询结果集【数据库查询】）实现ajax异步请求（get/post）

最新推荐文章于 2023-01-27 08:43:21 发布

zhaoguanchenga

最新推荐文章于 2023-01-27 08:43:21 发布

阅读量293

点赞数

分类专栏： python 文章标签： ajax django html5

本文链接：https://blog.csdn.net/zhaoguanchenga/article/details/104712724

版权

python 专栏收录该内容

4 篇文章 0 订阅

订阅专栏

jquery

## urls.py

from django.urls import re_path
from .views import *
urlpatterns=[
    re_path(r'^what', what_views),
]

## views.py

from django.http import HttpResponse
def what_views(request):
    return HttpResponse('jquery us ok')

## (get).html

<button onclick="jqAjaxBtn()">jequery-ajax</button>
<div id="show"></div>
<script src="{% static 'js/jquery-3.4.1.js' %}"></script>
<script>
    function jqAjaxBtn(){
        {#$.get(url,data,callback,dataType)#}
        $.get('/what',function (data) {
            $("#show").html(data);
        });
    }
</script>

## (post.注意post有csrf验证问题).html

{% csrf_token %}## 注意别忘记
<button onclick="jqAjaxBtn()">jequery-ajax</button>
<div id="show"></div>
<script src="{% static 'js/jquery-3.4.1.js' %}"></script>
<script>
    function jqAjaxBtn(){
      var params = {
      ## <input type="hidden" name="csrfmiddlewaretoken"
      ##  value="*****************">
      ## 标题$("[name='csrfmiddlewaretoken']").val() 取出csrfmiddlewaretoken的值
        'csrfmiddlewaretoken':$("[name='csrfmiddlewaretoken']").val()
      }

      $.post('/12-server/',params,function(data){
        //data表示的是响应回来的数据
        $("#show").html(data);
      });
    }
</script>

json(复杂数据）

## views.py

from django.http import HttpResponse
import json## 注意别忘记
def what_views(request):
    message={
        'name' :'zhao',
        'age': 50,
    }
    str=json.dumps(message)
    return HttpResponse(str)
    ## HttpResponse(‘jquery is ok’，str)是错误写法

## .html

<button onclick="jsonAjaxBtn()">json-ajax</button>
<div id="show"></div>
<script src="{% static 'js/jquery-3.4.1.js' %}"></script>
<script>
    function jsonAjaxBtn() {
        $.get('/what',function (data) {
            var html='';
            html+="<h3>姓名"+data.name+"</h3>";
            html+="<h3>年龄"+data.age+"</h3>";
            $("#show").html(html);
        },'json');
    }
</script>

serializers（查询结果集【数据库查询】）

## views.py

from django.http import HttpResponse
from django.core import serializers
from .models import *
def what_views(request):
    users = Users.objects.all()
    # 将uesrs转换成json字符串
    jsonStr =serializers.serialize('json',users)
    return HttpResponse(jsonStr)

## .html

<button onclick="jqAjaxBtn()">jequery-ajax</button>
<div id="show"></div>
<script src="{% static 'js/jquery-3.4.1.js' %}"></script>
<script>
    function jqAjaxBtn(){
        $.get('/what/',function (data) {
            $.each(data,function (i,obj) {
                console.log('id:'+obj.pk);
                console.log('name:'+obj.fields.name);
            });
        },'json');
    }
</script>