美文网首页
django-前后端交互

django-前后端交互

作者: 老夫刘某 | 来源:发表于2017-10-10 14:39 被阅读0次

创建一个html文件用来用户注册:

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title></title>
</head>
<body>

    <form action="/createuser/" method="post">

        <p>{{ obj.user }}</p>
        <p>{{ obj.group }}</p>

    <input type="submit" value="提交" />

</form>

</body>
</html>

配置好访问:

image.png

创建用户数据:

def createuser(request):

    obj = UserForm.CreateForm(request.POST)

    if request.method == 'POST':
        if obj.is_valid():
            all_data = obj.clean()

            group_id = all_data['group']
            username = all_data['user']

            # 1、先获取字典表里的数据对象
            # group_obj = models.GroupNew.objects.get(id=group_id)
            # # 创建用户数据
            # models.UserNew.objects.create(user=username, group=group_obj)

            # 2、 直接传group_id不需获取对象
            models.UserNew.objects.create(user=username, group_id=group_id)

        else:
            pass
    return render(request, 'foreign/createuser.html', {'obj': obj})

然后再vires.py里面就可以直接拿到前端传来的字典,直接创建数据了。注意用**的方式传参

from app01.forms import foreign  as UserForm


def createuser(request):

    obj = UserForm.CreateForm(request.POST)

    if request.method == 'POST':
        if obj.is_valid():
            all_data = obj.clean()
            print all_data
            # group_id = all_data['group']
            username = all_data['user']

            # 1、先获取字典表里的数据对象
            # group_obj = models.GroupNew.objects.get(id=group_id)
            # # 创建用户数据
            # models.UserNew.objects.create(user=username, group=group_obj)

            # 2、 直接传group_id不需获取对象

            models.UserNew.objects.create(**all_data)   #用**的方式传递字典参数

        else:
            pass
    return render(request, 'foreign/createuser.html', {'obj': obj})

下面我们可以来展示一下数据:

在views.pu里把数据全部拿到,返回到前端:

from app01.forms import foreign  as UserForm


def createuser(request):

    obj = UserForm.CreateForm(request.POST)

    if request.method == 'POST':
        if obj.is_valid():
            all_data = obj.clean()
            models.UserNew.objects.create(**all_data)
        else:
            pass

    user_list = models.UserNew.objects.all()   #获取到表中的全部数据

    return render(request, 'foreign/createuser.html', {'obj': obj, 'user_list': user_list})

前端页面获取数据展示:

在前端页面不能显示用户组的id,而是直接显示用户组的名称

因为外键对应的字段是一个对象,这个对象代指的是字典表中的一行数据,所以我们在前端取到字典表中的数据用“.”获取

<table>
        {% for item in user_list %}
            <tr>
                <td>{{ item.user }}</td>
                <td>{{ item.group.groupname }}</td>    从对象中获取数据用"."
            </tr>
        {% endfor %}
    </table>

我们在前端用get的方法获取数据,

在浏览器的url后追加字符 http://127.0.0.1:8000/createuser/?group=CFO

例如:我们要展示CFO组里面所以得用户,在views里要如何写呢?

我们在前端用get的方法获取数据,

在浏览器的url后追加字符   http://127.0.0.1:8000/createuser/?group=CEO

例如:我们要展示CEO组里面所以得用户,在views里要如何写呢?

from app01.forms import foreign as UserForm

def createuser(request):

obj = UserForm.CreateForm(request.POST)

if request.method == 'POST':
    if obj.is_valid():
        all_data = obj.clean()
        models.UserNew.objects.create(**all_data)
    else:
        pass
val = request.GET.get('group')
user_list = models.UserNew.objects.filter(group__groupname=val)   # 去字典表里的数据时用双下划线

return render(request, 'foreign/createuser.html', {'obj': obj, 'user_list': user_list})
总结
创建数据:

1、根据对象级别来操作表。
表中有外键的字段代指的就是另外一张表的一行数据。在Models里的表现形式就是一个对象,那么我们创建这张表时,给外键的字段传值时也应该传一个对象,而从前台获取到的是一个数字“1”,1不是一个对象,根据这个“1”先创建一个字典表的对象,所以根据前台的“1”先获取字典表里对应的数据对象,把这个对象传递到创建表时所需的对象参数即可。
(其实也是把对象转换成sql语句拼接成带_id的样式,有一种多此一举的感觉)

2、根据数据库级别来操作表。
首先我们可以先查看一下数据库表中的外键值的样式 user_group_id。“_id”在models没有定义的,是django自动为我们定义的样式。所以我们在向数据库中插入数据的时候,外键的字段应该加上_id,这样就可以直接传从前台获取的数字了。
(可以再form中修改外键的值,加"_id",这样传到后台的数据就能直接拿到一个字典,在用**的方式传值创建数据)

获取数据:

跨表取数据用 "."
因为在models里的外键代指的是另外一张表的一行数据,且这个数据类型为一个对象。
那么就可以根据这个对象直接找到那行数据里对应的字段。用 “.”获取
在前端页面就可以{{item.group.groupname}}方式获取到。

跨表过滤数据时用 “__”
过滤数据用双下划线 “__”(group__groupname=val),如果有多张表建立外键继续用双下划线“__”跨表查询数据

相关文章

  • django-前后端交互

    创建一个html文件用来用户注册: 配置好访问: 创建用户数据: 然后再vires.py里面就可以直接拿到前端传来...

  • Django-实现前后端数据交互(二)

    Project.apps 一个Web项目就相当于是一个Project,如:我们创建的个人网站【mysite】。而在...

  • Django-实现图形验证码、短信验证码功能(二)

    接上文:Django-实现图形验证码、短信验证码功能(一) 短信验证码后端发送实现 在settings中添加red...

  • 前后端交互如何保证安全性?

    前言 web与后端,andorid与后端,ios与后端,像这种类型的交互其实就属于典型的前端与后端进行交互。在与B...

  • 前后端交互完成的新学期最有收获感的一周

      本周,我们的商城项目进入了前后端交互,而且前后端交互也已经完成,ajax和thymeleaf交互模板也已经实现...

  • HTTP协议、存储、Ajax

    前后端数据交互与 HTTP 协议 1、前后端通信是什么(1)前端和后端交互的过程(2)浏览器和服务器之间数据交互的...

  • Vue(3)

    前后端交互 前后端交互模式 Promise用法 接口调用-fetch用法 接口调用-async/await用法 接...

  • 前后端数据交互方法

    《前后端数据交互方法》http://www.zhihu.com/question/26532621一个小案例搞懂前...

  • 2018-02-08

    前端与后端的数据交互 前端与后端的数据交互,最常用的就是GET、POST,比较常用的用法是:提交表单数据到后端,后...

  • SpringBoot学习随笔

    React前端和Spring boot后端的交互整合 前后端接口交互整合,可以通过spring boot的thym...

网友评论

      本文标题:django-前后端交互

      本文链接:https://www.haomeiwen.com/subject/xzbvyxtx.html