让用户输入,并提交信息的网页中,包含表单。也就是说,表单是用户编辑页面中的一个组成部分,其余的部分还可以包括文本、链接、按钮等。
在之前的项目实现中,要修改数据库中的内容,需要使用Admin site,用管理员登录。
在本文中,将在页面上,由用户对数据库内容进行修改,也就是用户提交表单,表单中包含要修改的数据。
本文实现功能包括:
1、新建‘城市’
2、新建特定城市的‘信息’
具体实施如下。
---------------------------------------------
1、新建‘城市’
1)新建.\snap_gram\city_infos目录下的forms.py文件,用于存储各种表单类。
新增CityForm类,它是提交‘城市’信息时,使用的表单类。
from django import forms
from .models import Cityclass 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 viewsapp_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 CityFormdef 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,Entryclass 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 = Entryfields = ['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,Entryfrom .forms import CityForm,EntryForm'''省略其他视图函数'''def new_entry(request,city_id):'''Add new Entry to specific city'''city = City.objects.get(id=city_id)#找到指定的cityif 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 %}