前端页面提交数据到数据库
1、建立工程
django-admin startproject test1_3
2、创建app
python manage.py startapp hxz
3、配置settings.py
(1)注册app
INSTALLED_APPS = [
'django.contrib.admin',
'django.contrib.auth',
'django.contrib.contenttypes',
'django.contrib.sessions',
'django.contrib.messages',
'django.contrib.staticfiles',
'hxz',
]
（2）配置数据库参数
DATABASES = {
'default': {
'ENGINE': 'django.db.backends.mysql',
'NAME': 'DO',
'USER': 'do',
'PASSWORD': 'Shuang00',
'HOST': '210.42.150.134',
'PORT': '3306',
}
}
(3) 创建_ init _.py
import pymysql
pymysql.install_as_MySQLdb()
4、使用现有数据库同步models.py
（1）python manage.py inspectdb > lxm/models.py
（2）models中调整managed = Ture
（3）python manage.py makemigrations
python manage.py migrate --fake-initial
5、后台管理admin
(1)创建管理员用户
python manage.py createsuperuser
(2)启动开发服务器
http://127.0.0.1:8000/admin/
（3）在admin中注册应用
from django.contrib import admin
from . models import SjcxMi
admin.site.register(SjcxMi)
(4)重启开发服务器
python manage.py runserver
6、编写views.py
from django.shortcuts import render
from .models import SjcxMi
def add(request):
if request.method == 'GET':
return render(request, 'add.html')
if request.method == 'POST':
if SjcxMi.objects.filter(xh=request.POST.get('xh')).exists():
return render(request, 'no.html')
else:
SjcxMi.objects.create(
xh=request.POST.get('xh', None),
time=request.POST.get('time', None),
price=request.POST.get('price', None),
pmlx=request.POST.get('pmlx', None),
ccnh=request.POST.get('ccnh', None),
system=request.POST.get('system', None),
cpu=request.POST.get('cpu', None),
color=request.POST.get('color', None),
jsuo=request.POST.get('jsuo', None),
cmplx=request.POST.get('cmplx', None),
pmsize=request.POST.get('pmsize', None),
zpcz=request.POST.get('zpcz', None),
zpfbl=request.POST.get('zpfbl', None),
pmxsmd=request.POST.get('pmxsmd', None),
pmjs=request.POST.get('pmjs', None),
zbk=request.POST.get('zbk', None),
pmzb=request.POST.get('pmzb', None),
qtpmcs=request.POST.get('qtpmcs', None),
cpupl=request.POST.get('cpupl', None),
hxs=request.POST.get('hxs', None),
gpu=request.POST.get('gpu', None),
ram=request.POST.get('ram', None),
rom=request.POST.get('rom', None),
cclx=request.POST.get('cclx', None),
dcrl=request.POST.get('dcrl', None),
sxtzs=request.POST.get('sxtzs', None),
hzxxt=request.POST.get('hzxxt', None),
qzxxt=request.POST.get('qzxxt', None),
cgqlx=request.POST.get('cgqlx', None),
cgqxh=request.POST.get('cgqxh', None),
sgd=request.POST.get('sgd', None),
gq=request.POST.get('gq', None),
gj=request.POST.get('gj', None),
jj=request.POST.get('jj', None),
sxtts=request.POST.get('sxtts', None),
pzgn=request.POST.get('pzgn', None),
qtxxtcs=request.POST.get('qtxxtcs', None),
sjsize=request.POST.get('sjsize', None),
sjweight=request.POST.get('sjweight', None),
qtwgcs=request.POST.get('qtwgcs', None),
)
return render(request, 'ok.html')
7、编写urls
from django.conf.urls import url
from django.contrib import admin
from hxz import views
urlpatterns = [
url(r'^admin/', admin.site.urls),
url(r'^$', views.add, name='home'),
]
8、编写HTML
(1) add.html
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>添加手机信息</title>
<style type="text/css">a {text-decoration: none}
a { color:blue; transition:0.5s; }
a:hover { color:cornflowerblue; }
</style>
<script language="javascript">
function sumbit_sure()
{
var gnl=confirm("确定要提交?");
if (gnl==true)
{
return true;
}
else
{
return false;
}
}
</script>
</head>
<body>
<h1>添加手机信息</h1>
<form action="" onsubmit="return sumbit_sure()" method="post" >
<div>
<p>型号<input type="=text" name="xh", required></p>
<p>上市时间<input type="=text" name="time"></p>
<p>电商报价  <input type="=text" name="price"></p>
<p>屏幕类型  <input type="=text" name="pmlx"></p>
<p>出厂系统内核<input type="=text" name="ccnh"></p>
<p>操作系统<input type="=text" name="system"></p>
<p>CPU型号<input type="=text" name="cpu"></p>
<p>机身颜色<input type="=text" name="color"></p>
<p>解锁方式<input type="=text" name="jsuo"></p>
<p>触屏幕类型<input type="=text" name="cmplx"></p>
<p>主屏尺寸<input type="=text" name="pmsize"></p>
<p>主屏材质<input type="=text" name="zpcz"></p>
<p>主屏分辨率<input type="=text" name="zpfbl"></p>
<p>屏幕像素密度<input type="=text" name="pmxsmd"></p>
<p>屏幕技术<input type="=text" name="pmjs"></p>
<p>窄边框<input type="=text" name="zbk"></p>
<p>屏幕占比<input type="=text" name="pmzb"></p>
<p>其他屏幕参数<input type="=text" name="qtpmcs"></p>
<p>CPU频率<input type="=text" name="cpupl"></p>
<p>核心数<input type="=text" name="hxs"></p>
<p>GPU型号<input type="=text" name="gpu"></p>
<p>RAM容量<input type="=text" name="ram"></p>
<p>ROM容量<input type="=text" name="rom"></p>
<p>储存类型<input type="=text" name="cclx"></p>
<p>电池容量<input type="=text" name="dcrl"></p>
<p>摄像头总数<input type="=text" name="sxtzs"></p>
<p>后置摄像头<input type="=text" name="hzxxt"></p>
<p>前置摄像头<input type="=text" name="qzxxt"></p>
<p>传感器类型<input type="=text" name="cgqlx"></p>
<p>传感器型号<input type="=text" name="cgqxh"></p>
<p>闪光灯<input type="=text" name="sgd"></p>
<p>光圈<input type="=text" name="gq"></p>
<p>广角<input type="=text" name="gj"></p>
<p>焦距/范围<input type="=text" name="jj"></p>
<p>摄像头特色<input type="=text" name="sxtts"></p>
<p>拍照功能<input type="=text" name="pzgn"></p>
<p>其他摄像头参数<input type="=text" name="qtxxtcs"></p>
<p>手机尺寸<input type="=text" name="sjsize"></p>
<p>手机重量<input type="=text" name="sjweight"></p>
<p>其他外观参数<input type="=text" name="qtwgcs"></p>
<p><input type="submit" value="提交信息"></p>
</div>
</form>
</body>
</html>
(2) no.html
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>no</title>
<style type="text/css">a {text-decoration: none}
a { color:blue; transition:0.5s; }
a:hover { color:cornflowerblue; }
a.zt{font-size: 20px}
</style>
</head>
<body>
<h1 style="background-color: white;color: darkred">该手机信息已存在!</h1>
<div>
<a href="{% url 'home' %}", class="zt">继续添加</a>
</div>
</body>
</html>
(3) ok.html
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>ok</title>
<style type="text/css">a {text-decoration: none}
a { color:blue; transition:0.5s; }
a:hover { color:cornflowerblue; }
a.zt{font-size: 20px}
</style>
</head>
<body>
<h1 style="background-color: white;color: green">提交成功!</h1>
<div>
<a href="{% url 'home' %}", class="zt">继续添加</a>
</div>
</body>
</html>