Django表单资源
2020-11-08 本文已影响0人
Chaweys
表单资源
可以在表单的Media子类中定义资源，其语法规则与小部件中的Media子类的规则相同。
举例：
E:\HDCZU_Test\chapter7\app\views.py文件
from django.forms import ValidationError
#定义校验age的函数
def validate_age(value):
if int(value)<20:
raise ValidationError("年龄不能小于20",code="min_value")
if int(value)>50:
raise ValidationError("年龄不能大于50",code="max_value")
from django.forms import ModelForm
from app.models import person
form django import forms
class personFormDIY_media(ModelForm):
age=forms.CharField(validators=[validate_age],
label="年龄",
widget=forms.NumberInput,
help_text="年龄为[20,50]以内的整数")
class Meta:
model=person
fields=["name","age"]
labels={"name":"姓名"}
help_texts={"name":"姓名为中英文字符串"}
widgets={"name":forms.Textarea(attrs={"cols":30,"rows":2})}
class Media: #定义子类Media，定义css资源和js资源
css={'all':('./static/diyform.css')}
js=('./static/focusinput.js')
def userPersonFromDIY_media(request):
if request.method=="POST":
mform=personFormDIY_media(request.POST)
if mform.is_valid():
ps=person.objects.filter(name=request.POST["name"])
if ps.count()==0:
mform.save()
msg="数据已保存"
else:
msg="数据已存在于数据库，请勿重新提交"
else:
msg="表单数据有误"
else:
mform=personFormDIY_media()
msg="请输入数据添加新纪录"
return render(request,"tempmedia.html",{"mform":mform,"msg":msg})
举例：E:\HDCZU_Test\chapter7\app\models.py文件
from django.db import models
class person(models.Model):
name=models.CharField(max_length=50)
age=models.SmallIntegerField()
举例：E:\HDCZU_Test\chapter7\chapter7\urls.py文件
from django.contrib import admin
from django.urls import path
from app import views
urlpatterns = [
path('admin/', admin.site.urls),
path('media/',views.userPersonFromDIY_media),
]
举例：E:\HDCZU_Test\chapter7\app\templates\tempmedia.html文件
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
</head>
<body>
<script src="/static/jquery-3.4.1.min.js"></script>
{{mform.media}}
<form action="/media/" method="POST">
{% csrf_token %}
<table>{{mform.as_p}}</table>
<input type="submit" value="提交"/>
</form>
<hr>
{{msg}}
</body>
</html>
举例：E:\HDCZU_Test\chapter7\app\static\focusinput.js
$(function () {
$("input,textarea").focus(function () {
$(this).addClass("inputfocus"); //获得焦点时添加类，改变背景颜色
});
$("input,textarea").blur(function () {
$(this).removeClass("inputfocus"); //失去焦点时删除类，回复默认背景颜色
});
})
举例：E:\HDCZU_Test\chapter7\app\static\diyform.css
.helptext {color:blue;}
.errorlist {color: red;}
.inputfocus {background-color:aquamarine;}
