Python 从0开始 一步步基于Django创建项目（7）简易网站中的表单

让用户输入，并提交信息的网页中，包含表单。也就是说，表单是用户编辑页面中的一个组成部分，其余的部分还可以包括文本、链接、按钮等。

在之前的项目实现中，要修改数据库中的内容，需要使用Admin site，用管理员登录。

在本文中，将在页面上，由用户对数据库内容进行修改，也就是用户提交表单，表单中包含要修改的数据。

本文实现功能包括：

1、新建‘城市’

2、新建特定城市的‘信息’

具体实施如下。

---------------------------------------------

1、新建‘城市’

1）新建.\snap_gram\city_infos目录下的forms.py文件，用于存储各种表单类。

新增CityForm类，它是提交‘城市’信息时，使用的表单类。

from django import forms
from .models import City

class CityForm(forms.ModelForm):#继承forms.ModelForm类
    class Meta:
        model = City#根据模型City创建表单
        fields = ['name']#表单中包含的字段
        labels = {'name':''}#让Django不要为字段text生成标签

2）修改.\snap_gram\city_infos目录下的urls.py，定义新建城市url。

from django.urls import path
from .import views

app_name = 'city_infos'
urlpatterns=[
    path('',views.index,name='index'),
    path('cities/',views.cities,name='cities'),
    path('cities/<int:city_id>/',views.city,name='city'),
    #用于添加城市的页面
    path('new_city/',views.new_city,name='new_city'),
]

3）修改.\snap_gram\city_infos目录下的views.py，新增函数如下。在这个视图函数中，用户输入数据来自表单form，它是表单类CityForm的实例，所以需要import CityForm。

from .forms import CityForm


def new_city(request):
    '''Add new City'''
    if request.method != 'POST':#未提交数据时，创建一个新表单，此时request.method=='GET'
        form = CityForm()
    else:#提交数据时
        form = CityForm(data=request.POST)#data是用户刚刚POST的数据，如此则form包含用户提交的数据
        if form.is_valid():#Django自动检查提交数据的合法性
            form.save()#通过检查后，将表单中的数据写入数据库
            return redirect('city_infos:cities')#页面重定向
    context = {'form':form}#程序不进入if块，或者没有通过有效性验证，都执行该行代码
    return render(request,'city_infos/new_city.html',context)

4）新建.\snap_gram\city_infos\templates\city_infos目录下的new_city.html文件。

{% extends "city_infos/base.html" %}

{% block content %}
    <p>Add a new city:</p>
    <form action="{% url 'city_infos:new_city' %}" method='post'>
        {% csrf_token %}
        {{ form.as_p }}
        <button name="submit">Add city</button>
    </form>

{% endblock content %}

5）修改.\snap_gram\city_infos\templates\city_infos目录下的cities.html文件，向其中添加一个Add  a new city的链接。

当点击了这个链接后，取得url注册信息，调用views文件中的new_city函数，然后渲染new_city.html页面。

{% extends "city_infos/base.html" %}

{% block content %}

    <p>Cities</p>

    <ul>
        {% for city in cities %}
            <li>
                <a href="{% url 'city_infos:city' city.id %}">{{ city }}</a>
            </li>
        {% empty %}
            <li>No topics have been added yet.</li>
        {% endfor %}
    </ul>
    <a href="{% url 'city_infos:new_city' %}">Add a new city</a>

{% endblock content %}

2、新建特定城市的‘信息’

1）修改.\snap_gram\city_infos目录下的forms.py文件。

新增EntryForm类，它是提交特定城市的具体‘信息’时，使用的表单类。

from django import forms
from .models import City,Entry

class CityForm(forms.ModelForm):#继承forms.ModelForm类
    class Meta:
        model = City#根据模型City创建表单
        fields = ['name']#表单中包含的字段
        labels = {'name':''}#让Django不要为字段text生成标签

class EntryForm(forms.ModelForm):#继承forms.ModelForm类
    class Meta:
        model = Entry
        fields = ['info']  # 表单中包含的字段
        labels = {'info':''}  # 让Django不要为字段text生成标签
        #定制了字段'text'的输入小部件widgets，将文本区域的宽度设置为80列，而不是默认的40列
        widgets = {'info':forms.Textarea(attrs={'cols':80})}

2）修改.\snap_gram\city_infos目录下的urls.py，定义新建特定城市的‘信息’的url

#为特定城市添加新条目页面
    path('new_entry/<int:city_id>/',views.new_entry,name='new_entry'),

3）修改.\snap_gram\city_infos目录下的views.py，新增函数如下。在这个视图函数中，用户输入数据来自表单form，它是表单类EntryForm的实例，所以需要import CityForm。

from django.shortcuts import render,redirect
from .models import City,Entry

from .forms import CityForm,EntryForm

'''省略其他视图函数'''

def new_entry(request,city_id):
    '''Add new Entry to specific city'''
    city = City.objects.get(id=city_id)#找到指定的city

    if request.method != 'POST':#未提交数据时，创建一个新表单，此时request.method=='GET'
        form = EntryForm()
    else:
        form = EntryForm(data=request.POST)  # data是用户刚刚POST的数据，如此则form包含用户提交的数据
        if form.is_valid():  # Django自动检查提交数据的合法性
            #commit=False的作用：让Django创建一个新条目，赋值给new_entry，但是不保存到数据
            new_entry = form.save(commit=False)
            #通过设定city，将新条目与指定city关联
            new_entry.city = city
            #再将新条目，保存到数据
            new_entry.save()
            return redirect('city_infos:city',city_id=city_id)  # 页面重定向
    context = {'city':city,'form':form}#程序不进入if块，或者没有通过有效性验证，都执行该行代码
    return render(request, 'city_infos/new_entry.html', context)

4）新建.\snap_gram\city_infos\templates\city_infos目录下的new_entry.html文件。

{% extends "city_infos/base.html" %}

{% block content %}
    <p><a href="{% url 'city_infos:city' city.id %}">{{ city }}</a></p>
    <p>Add a new entry:</p>
    <form action="{% url 'city_infos:new_entry' city.id %}" method='post'>
        {% csrf_token %}
        {{ form.as_p }}
        <button name="submit">Add entry</button>
    </form>

{% endblock content %}

5）修改.\snap_gram\city_infos\templates\city_infos目录下的city.html文件，向其中添加一个Add  a new entry的链接。

当点击了这个链接后，取得url注册信息，调用views文件中的new_entry函数，然后渲染new_entry.html页面。

{% extends 'city_infos/base.html'%}

{% block content %}

    <p>City:{{ city }}</p>

    <p>Infos:</p>
    <p>
        <a href="{% url 'city_infos:new_entry' city.id %}">Add a new entry</a>
    </p>
    <ul>
        {% for entry in entries %}
            <li>
                <p>{{ entry.date_added|date:'M d,Y H:i'}}</p>
                <p>{{ entry.info|linebreaks }}</p>
            </li>
        {% empty %}
            <li>该城市下未添加信息。</li>
        {% endfor %}
    </ul>

{% endblock content %}