Django环境配置
pycharm下创建Django项目
进入虚拟环境在linux,osx跟win下有所不同具体方式可以百度查找
创建register APP文件
虚拟环境在终端中输入 python manage.py startapp register
可以看见在文件中出现了register文件夹
#注册界面的表单
- 在templates文件下创建register.html
写入
{% load staticfiles %}
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta http-equiv="x-ua-compatible" content="ie=edge">
<title>五四演讲报名表</title>
<meta name="description" content="">
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="manifest" href="site.webmanifest">
<link rel="apple-touch-icon" href="icon.png">
<!-- Place favicon.ico in the root directory -->
<link rel="stylesheet" href="{% static 'css/normalize.css' %}">
<link rel="stylesheet" href="//g.alicdn.com/msui/sm/0.6.2/css/sm.css">
<link rel="stylesheet" href="{% static 'css/main.css' %}">
</head>
<body style="background: #f0faff">
<!--[if lte IE 9]>
<p class="browserupgrade">You are using an <strong>outdated</strong> browser. Please <a href="https://browsehappy.com/">upgrade your browser</a> to improve your experience and security.</p>
<![endif]-->
<!-- Add your site or application content here -->
<div class="content">
<div class="list-block" style="margin-top: 0%">
<img style="width: 100%" src="{% static 'img/timg.jpg' %}" alt="">
<ul style="background: #f0faff">
<form method = 'post' enctype="multipart/form-data">
{% csrf_token %}
<li>
<div class="item-content">
<div class="item-media"><i class="icon icon-me"></i></div>
<div class="item-inner">
<div class="item-title label">姓名</div>
<div class="item-input">
<input type="text" name="Sname" placeholder="请输入您的姓名">
</div>
</div>
</div>
</li>
<li>
<div class="item-content">
<div class="item-media"><i class="icon icon-card"></i></div>
<div class="item-inner">
<div class="item-title label">学号</div>
<div class="item-input">
<input type="text" name="Sid" placeholder="请输入您的学号">
</div>
</div>
</div>
</li>
<li>
<div class="item-content">
<div class="item-media"><i class="icon icon-star"></i></div>
<div class="item-inner">
<div class="item-title label">性别</div>
<div class="item-input">
<select name="Sex">
<option value="" selected>**请选择**</option>
<option>男</option>
<option>女</option>
</select>
</div>
</div>
</div>
</li>
<li>
<div class="item-content">
<div class="item-media"><i class="icon icon-home"></i></div>
<div class="item-inner">
<div class="item-title label">院系</div>
<div class="item-input">
<select name="Department">
<option value="" selected>**请选择**</option>
<option>机械科学与工程学院</option>
<option>计算机科学与技术学院</option>
<option>生命科学与技术学院</option>
<option>电气与电子工程学院</option>
<option>材料科学与工程学院</option>
<option>船舶与海洋工程学院</option>
<option>能源与动力工程学院</option>
<option>自动化学院</option>
<option>光学与电子信息学院</option>
<option>水电与数字化工程学院</option>
<option>软件学院</option>
<option>环境科学与工程学院</option>
<option>电子信息与通信学院</option>
<option>建筑与城市规划学院</option>
<option>土木工程与力学学院</option>
<option>化学与化工学院</option>
<option>数学与统计学院</option>
<option>物理学院</option>
<option>公共管理学院</option>
<option>经济学院</option>
<option>管理学院</option>
<option>人文学院</option>
<option>新闻与信息传播学院</option>
<option>马克思主义学院</option>
<option>社会学院</option>
<option>法学院</option>
<option>外国语学院</option>
<option>基础医学院</option>
<option>药学院</option>
<option>医药卫生管理学院</option>
<option>公共卫生学院</option>
<option>法医学系</option>
<option>护理学院</option>
<option>计划生育研究所</option>
<option>第一临床学院</option>
<option>第二临床学院</option>
<option>第三临床学院</option>
<option>远程与继续教育学院</option>
<option>教育科学研究院</option>
<option>中欧清洁与可再生能源学院</option>
<option>体育部</option>
<option>艺术教育中心</option>
<option>武汉光电国家研究中心</option>
<option>工程科学学院(国际化示范学院)</option>
<option>武汉国际微电子学院</option>
<option>航空航天学院</option>
</select>
</div>
</div>
</div>
</li>
<li>
<div class="item-content">
<div class="item-media"><i class="icon icon-edit"></i></div>
<div class="item-inner">
<div class="item-title label">专业班级</div>
<div class="item-input">
<input type="text" name="Major_class" placeholder="请输入您的专业班级">
</div>
</div>
</div>
</li>
<li>
<div class="item-content">
<div class="item-media"><i class="icon icon-phone"></i></div>
<div class="item-inner">
<div class="item-title label">手机号码</div>
<div class="item-input">
<input type="tel" name="Phone_number" placeholder="请输入您的手机号码">
</div>
</div>
</div>
</li>
<li>
<div class="item-content">
<div class="item-media"><i class="icon icon-message"></i></div>
<div class="item-inner">
<div class="item-title label">邮箱</div>
<div class="item-input">
<input type="email" name="Email" placeholder="请输入您的邮箱地址">
</div>
</div>
</div>
</li>
<li class="align-top">
<div class="item-content">
<div class="item-media"><i class="icon icon-form-comment"></i></div>
<div class="item-inner">
<div class="item-input">
<textarea placeholder="参赛宣言" name="Declaration"></textarea>
</div>
</div>
</div>
</li>
<li class="align-top">
<div class="item-content">
<div class="item-media"><i class="icon icon-form-comment"></i></div>
<div class="item-inner">
<div class="item-input">
<textarea placeholder="个人简介" name="Resume"></textarea>
</div>
</div>
</div>
</li>
<li class="align-top">
<div class="item-content">
<div class="item-media"><i class="icon icon-form-comment"></i></div>
<div class="item-inner">
<div class="item-input">
<textarea placeholder="对于大赛主题的理解" name="Comprehension"></textarea>
</div>
</div>
</div>
</li>
<div class="content-block">
<div class="row">
<div class="col-50"><input type="submit" value="提交" class="button button-big button-fill button-success"></div>
</div>
</div>
<!--<input type="submit" value = "ok" >-->
</form>
</ul>
<script src="{% static 'js/vendor/modernizr-3.5.0.min.js' %}"></script>
<script src="https://code.jquery.com/jquery-3.2.1.min.js" integrity="sha256-hwg4gsxgFZhOsEEamdOYGBf13FyQuiTwlAQgxVSNgt4=" crossorigin="anonymous"></script>
<script>window.jQuery || document.write('<script src="{% static 'js/vendor/jquery-3.2.1.min.js' %}"><\/script>')</script>
<script type='text/javascript' src='//g.alicdn.com/sj/lib/zepto/zepto.js' charset='utf-8'></script>
<script type='text/javascript' src='//g.alicdn.com/msui/sm/0.6.2/js/sm.js' charset='utf-8'></script>
<script src="{% static 'js/plugins.js' %}"></script>
<script src="{% static 'js/main.js' %}"></script>
</body>
</html>
- 再在同一目录下创建一个success.html用于显示成功后的界面
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title>注册成功</title>
</head>
<body>
<h1>恭喜{{ Sname }},报名成功!</h1>
</body>
</html>
- 引入静态文件
在register目录下创建static然后下载在github中下载 css js img文件
源码
#创建模型
from django.db import models
from django.contrib import admin. #引入库文件
class Participator(models.Model):
Sname = models.CharField(max_length=10, blank=False)
Sid = models.CharField(max_length=20, blank=False)
Sex = models.CharField(max_length=4, blank=False)
Department = models.CharField(max_length=100, blank=False)
Major_class = models.CharField(max_length=100, blank=False)
Phone_number = models.CharField(max_length=20, blank=False)
Email = models.EmailField()
Declaration = models.CharField(max_length=200, blank=False)
Resume = models.CharField(max_length=100, blank=False)
Comprehension = models.CharField(max_length=100, blank=False)
#定义数据库字段
def __str__(self):
return self.Name
class ParticipatorAdmin(admin.ModelAdmin):
list_display = ('Sname','Department','Sid','Sex','Major_class','Email','Phone_number','Declaration','Resume','Comprehension')
admin.site.register(Participator,ParticipatorAdmin)##在Django后台admin管理界面显示Participator数据
#在app.py写入app定义
from django.apps import AppConfig
class RegisterConfig(AppConfig):
name = 'register'
#写入视图函数
在register/views.py中写入
from django.shortcuts import render,render_to_response
from django import forms
from django.http import HttpResponse,HttpResponseRedirect
from django.template import RequestContext
from register.models import Participator
# Create your views here.
#自定义表单模型
class ParticipatorForm(forms.Form):
Sname = forms.CharField(label = '姓名:',max_length = 10)
Sid = forms.CharField(label = '学号:',max_length=20)
Email = forms.EmailField(label = '邮箱:')
Sex = forms.CharField(label='性别:',max_length=4)
Department = forms.CharField(label='院系:',max_length=100)
Major_class = forms.CharField(label='专业班级:',max_length=100)
Phone_number = forms.CharField(label='手机号码:',max_length=20)
Declaration = forms.CharField(label='参赛宣言:',max_length=200)
Resume = forms.CharField(label='个人简介:',max_length=100)
Comprehension = forms.CharField(label='主题理解:',max_length=100)
def register(request):
if request.method == 'POST':
pf = ParticipatorForm(request.POST)
if pf.is_valid():
#获取表单元素
Sname = pf.cleaned_data['Sname']
Sid = pf.cleaned_data['Sid']
Email = pf.cleaned_data['Email']
Sex = pf.cleaned_data['Sex']
Phone_number = pf.cleaned_data['Phone_number']
Department = pf.cleaned_data['Department']
Declaration = pf.cleaned_data['Declaration']
Major_class = pf.cleaned_data['Major_class']
Resume = pf.cleaned_data['Resume']
Comprehension = pf.cleaned_data['Comprehension']
#将表单写入数据库
user = Participator()
user.Sname = Sname
user.Sid = Sid
user.Email = Email
user.Declaration = Declaration
user.Phone_number = Phone_number
user.Sex = Sex
user.Comprehension = Comprehension
user.Major_class = Major_class
user.Resume = Resume
user.Department = Department
user.save()
#返回注册成功页面
return render_to_response('success.html',{'Sname':Sname})
else:
pf = ParticipatorForm()
return render_to_response('register.html',{'pf':pf})
绑定视图与url
在register中 创建urls.py
写入
from django.urls import path
from register import views
urlpatterns = [
#http://127.0.0.1:8000/account/ 这两个url指向都是注册页面
path('', views.register, name='register'),
path('register/',views.register,name = 'register'),
]
#在主文件中加入url
打开主文件下的urls.py
写入
from django.contrib import admin
from django.urls import path,include
urlpatterns = [
path('admin/', admin.site.urls),
path('register/', include('register.urls')),
]
#在主文件中引入app
打开主文件下的settings.py
修改
INSTALLED_APPS = [
'django.contrib.admin',
'django.contrib.auth',
'django.contrib.contenttypes',
'django.contrib.sessions',
'django.contrib.messages',
'django.contrib.staticfiles',
]
为
INSTALLED_APPS = [
'django.contrib.admin',
'django.contrib.auth',
'django.contrib.contenttypes',
'django.contrib.sessions',
'django.contrib.messages',
'django.contrib.staticfiles',
'register',
]
然后把middleware中'django.middleware.csrf.CsrfViewMiddleware',
删除或者注释掉
#善后
- 创建超级用户
python manage.py createsuperuser
- 迁移数据库
python manage.py makemigrations
python manage.py migrate
#参考资料
- 问题联系 邮箱 : 337113250@qq.com
- 或者在评论中显示在github上提出issue