django学习3——数据操作（2）

最新推荐文章于 2024-08-27 16:38:10 发布

shiki99

最新推荐文章于 2024-08-27 16:38:10 发布

阅读量98

点赞数

分类专栏： Django学习笔记文章标签： python

本文链接：https://blog.csdn.net/shiki99/article/details/113446086

版权

Django学习笔记专栏收录该内容

8 篇文章 0 订阅

订阅专栏

本文介绍了如何使用Django处理前端表单数据，包括修改HTML表单以匹配URL，设置GET和POST提交方式，处理CSRF token防止跨站请求伪造，以及在views.py中提取并保存数据到数据库。同时，展示了如何在模板中显示已存储的数据，并对代码进行了优化，简化了URL管理和数据展示。

摘要由CSDN通过智能技术生成

从前端获取数据并保存到数据库

html模板：

<!DOCTYPE html>

<html lang="en">
<head>
    <meta charset="UTF-8">
    <title></title>
    <link rel="stylesheet" href="/static/css/style.css">
</head>
<body>
<form action="/form/" method="post" class="smart-green">
    <h1>留言信息
        <span>请留下你的信息.</span>
    </h1>
    <label>
        <span>姓名 :</span>
        <input id="name" type="text" name="name" class="error" placeholder="请输入您的姓名"/>
        <div class="error-msg"></div>
    </label>

    <label>
        <span>邮箱 :</span>
        <input id="email" type="email" value="" name="email" placeholder="请输入邮箱地址"/>
        <div class="error-msg"></div>
    </label>

    <label>
        <span>联系地址 :</span>
        <input id="address" type="text" value="" name="address" placeholder="请输入联系地址"/>
        <div class="error-msg"></div>
    </label>

    <label>
        <span>留言 :</span>
        <textarea id="message" name="message"  placeholder="请输入你的建议"></textarea>
        <div class="error-msg"></div>
    </label>
    <div class="success-msg"></div>
    <label>
        <span>&nbsp;</span>
        <input type="submit" class="button" value="提交"/>
    </label>
</form>

</body>
</html>

将<form action="/form/" method="post" class="smart-green">修改：
1、form 改为与url一致的 message_form
2、method：两种提交方式post和get

写好input后加入以下内容，即可提交数据到后端。

    <label>
        <span>&nbsp;</span>
        <input type="submit" class="button" value="提交"/>
    </label>

重新运行项目，在页面中填写信息后提交，会出现以下问题
在这里插入图片描述
解决方法：在form结束处加入：{% csrf_token %}

再回到页面进行提交就不会出问题了。

之后，进入views.py ，在页面提交一下，得到request类型为WSGIRequst
在这里插入图片描述

关于input标签： 标签用于搜集用户信息。

html <input id="address" type="text" value="" name="address"
 placeholder="请输入联系地址"/>

name属性规定 input 元素的名称。

name 属性用于对提交到服务器后的表单数据进行标识，或者在客户端通过 JavaScript 引用表单数据。

注释：只有设置了 name 属性的表单元素才能在提交表单时传递它们的值。
更具体内容可以查看以下网站

https://www.w3school.com.cn/tags/tag_input.asp

输入以下代码，将数据存入数据库


def message_form(request):
    if request.method == 'POST':
        name = request.POST.get('name', '')  # 参数与html中input设定的name要保持一致
        email = request.POST.get('email', '')
        address = request.POST.get('address', '')
        mymessage = request.POST.get('message', '')

        message = Message()
        message.name = name
        message.email = email
        message.address = address
        message.message = mymessage
        message.save()

    return render(request, "message_form/message_form.html")

原本接受和提交请求可以写成两个url，比如message_form 和 add_message_form，但是那样后期会因为创建太多url而管理困哪，所以用if的方法将两个url浓缩到一个url中来

提取数据

def message_form(request):
    if request.method == 'GET':
        all_messages = Message.objects.all()[0]
        if all_messages:
            message = all_messages[0]
        return render(request, "message_form/message_form.html", {
            "message": message
        })
        # 或 return render(request, "message_form/message_form.html", locals())

可以优化为：

    if request.method == 'GET':
        var_dict = {}
        all_messages = Message.objects.all()[0]
        if all_messages:
            message = all_messages[0]
            var_dict = {
                'message':message
            }
        return render(request, "message_form/message_form.html", var_dict)

然后修改html，input的话添加value = {{ message.xxx }}

<label>
        <span>姓名 :</span>
        <input id="name" type="text" value = "{{ message.name }}" name="name" class="error" placeholder="请输入您的姓名"/>
        <div class="error-msg"></div>
    </label>

textarea添加 {{ message.xxx }}如下

  <label>
        <span>留言 :</span>
        <textarea id="message" name="message"  placeholder="请输入你的建议">{{ message.message }}</textarea>
        <div class="error-msg"></div>
    </label>

重新运行项目，重新输入网址进来后：
在这里插入图片描述

django中的常用内置标签

在这里插入图片描述

shiki99

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
django学习3——数据操作（2）

从前端获取数据并保存到数据库html模板：<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title></title> <link rel="stylesheet" href="/static/css/style.css"></head><body><form action="/f
复制链接

扫一扫

专栏目录