如何把整张表格的数据通过form表单的方式传回后台
开发背景：
前段时间遇到这么一个需求，就是把一整张表格的数据存储在数据库中，之后再渲染在页面中，还可以进行重新编辑。
例如下边的课程表（为了方便，所以都是软件工程）。
我也是经过一段时间的思考，才实现了整个功能。
思考过程：
思考过程中，想过用ajax,感觉还是太麻烦了，放弃。
第二个，是找网上现成的接口，比如表单大师之类的。。。但是找来找去找不到，没有符合要求的接口。放弃。
第三个，想到python万能的包来实现，还是相信python的包是万能的23333，百度来百度去，找不到。放弃。
最后还是，老老实实用form表单去传吧。。。
设计过程：
怎么把表格中的数据通过form表单提交的方式给到后台呢？既然确定了传递的方法，就要考虑数据表怎么设计了。
思来想去，感觉一个数据表怎么都不够，需要多个数据表。最后还是结合<table>标签的特点，就是<table>中<tr>标签表示是表格一行的内容的，而且方便进行数据渲染。所以，表格一行的数据都有一个数据表对应。这。。。应该是最笨的方法了吧，而且这种方法只适用于小一点的表格，几行几列的那种。要是大表格的话，这种方式会需要很多数据表。。。后端有会有很大的代码量。
代码片段展示：
前端html部分：
1 <h1 align="center"><b><caption>课程表</caption></b></h1>
2 <body text="#000000">
3 <form action="/reedtioncurriculum/" method="POST">
4 <table style="color:#000"width="1200" height="480" border="1" background="Hydrangeas.jpg">
5 <tr>
6 <td width="76"> </td>
7 <td width="86" height="50"> </td>
8 <td width="100">周一</td>
9 <td width="100">周二</td>
10 <td width="100">周三</td>
11 <td width="100">周四</td>
12 <td width="100">周五</td>
13 <td width="100">周六</td>
14 <td width="108">周日</td>
15 </tr>
16 <tr>
17
18 <td rowspan="4">上午</td>
19
20 <td rowspan="2">1</td>
21 <td rowspan="2">
22 <select name="monday_1">
23 {% for i in courselist %}
24 <option>{{ i.coursename }}</option>
25 {% endfor %}
26 </select>
27 </td>
28 <td rowspan="2">
29 <select name="tuesday_1">
30 {% for i in courselist %}
31 <option>{{ i.coursename }}</option>
32 {% endfor %}
33 </select>
34 </td>
35 <td rowspan="2">
36 <select name="wednesday_1">
37 {% for i in courselist %}
38 <option>{{ i.coursename }}</option>
39 {% endfor %}
40 </select>
41 </td>
42 <td rowspan="2">
43 <select name="thursday_1">
44 {% for i in courselist %}
45 <option>{{ i.coursename }}</option>
46 {% endfor %}
47 </select>
48 </td>
49 <td rowspan="2">
50 <select name="friday_1">
51 {% for i in courselist %}
52 <option>{{ i.coursename }}</option>
53 {% endfor %}
54 </select>
55 </td>
56 <td rowspan="2">
57 <select name="saturday_1">
58 {% for i in courselist %}
59 <option>{{ i.coursename }}</option>
60 {% endfor %}
61 </select>
62 </td>
63 <td rowspan="2">
64 <select name="sunday_1">
65 {% for i in courselist %}
66 <option>{{ i.coursename }}</option>
67 {% endfor %}
68 </select>
69 </td>
70 </tr>
71 <tr>
72 </tr>
73 <tr>
74 <td rowspan="2">2</td>
75 <td rowspan="2">
76 <select name="monday_2">
77 {% for i in courselist %}
78 <option>{{ i.coursename }}</option>
79 {% endfor %}
80 </select>
81 </td>
82 <td rowspan="2">
83 <select name="tuesday_2">
84 {% for i in courselist %}
85 <option>{{ i.coursename }}</option>
86 {% endfor %}
87 </select>
88 </td>
89 <td rowspan="2">
90 <select name="wednesday_2">
91 {% for i in courselist %}
92 <option>{{ i.coursename }}</option>
93 {% endfor %}
94 </select>
95 </td>
96 <td rowspan="2">
97 <select name="thursday_2">
98 {% for i in courselist %}
99 <option>{{ i.coursename }}</option>
100 {% endfor %}
101 </select>
102 </td>
103 <td rowspan="2">
104 <select name="friday_2">
105 {% for i in courselist %}
106 <option>{{ i.coursename }}</option>
107 {% endfor %}
108 </select>
109 </td>
110 <td rowspan="2">
111 <select name="saturday_2">
112 {% for i in courselist %}
113 <option>{{ i.coursename }}</option>
114 {% endfor %}
115 </select>
116 </td>
117 <td rowspan="2">
118 <select name="sunday_2">
119 {% for i in courselist %}
120 <option>{{ i.coursename }}</option>
121 {% endfor %}
122 </select>
123 </td>
124 </tr>
125 <tr>
126 </tr>
127 <tr>
128 <td colspan="9" align="center"><b>午休</b></td>
129 </tr>
130 <tr>
131 <td rowspan="4">下午</td>
132 <td rowspan="2">3</td>
133 <td rowspan="2">
134 <select name="monday_3">
135 {% for i in courselist %}
136 <option>{{ i.coursename }}</option>
137 {% endfor %}
138 </select>
139 </td>
140 <td rowspan="2">
141 <select name="tuesday_3">
142 {% for i in courselist %}
143 <option>{{ i.coursename }}</option>
144 {% endfor %}
145 </select>
146 </td>
147 <td rowspan="2">
148 <select name="wednesday_3">
149 {% for i in courselist %}
150 <option>{{ i.coursename }}</option>
151 {% endfor %}
152 </select>
153 </td>
154 <td rowspan="2">
155 <select name="thursday_3">
156 {% for i in courselist %}
157 <option>{{ i.coursename }}</option>
158 {% endfor %}
159 </select>
160 </td>
161 <td rowspan="2">
162 <select name="friday_3">
163 {% for i in courselist %}
164 <option>{{ i.coursename }}</option>
165 {% endfor %}
166 </select>
167 </td>
168 <td rowspan="2">
169 <select name="saturday_3">
170 {% for i in courselist %}
171 <option>{{ i.coursename }}</option>
172 {% endfor %}
173 </select>
174 </td>
175 <td rowspan="2">
176 <select name="sunday_3">
177 {% for i in courselist %}
178 <option>{{ i.coursename }}</option>
179 {% endfor %}
180 </select>
181 </td>
182 </tr>
183 <tr>
184 </tr>
185 <tr>
186 <td rowspan="2">4</td>
187 <td rowspan="2">
188 <select name="monday_4">
189 {% for i in courselist %}
190 <option>{{ i.coursename }}</option>
191 {% endfor %}
192 </select>
193 </td>
194 <td rowspan="2">
195 <select name="tuesday_4">
196 {% for i in courselist %}
197 <option>{{ i.coursename }}</option>
198 {% endfor %}
199 </select>
200 </td>
201 <td rowspan="2">
202 <select name="wednesday_4">
203 {% for i in courselist %}
204 <option>{{ i.coursename }}</option>
205 {% endfor %}
206 </select>
207 </td>
208 <td rowspan="2">
209 <select name="thursday_4">
210 {% for i in courselist %}
211 <option>{{ i.coursename }}</option>
212 {% endfor %}
213 </select>
214 </td>
215 <td rowspan="2">
216 <select name="friday_4">
217 {% for i in courselist %}
218 <option>{{ i.coursename }}</option>
219 {% endfor %}
220 </select>
221 </td>
222 <td rowspan="2">
223 <select name="saturday_4">
224 {% for i in courselist %}
225 <option>{{ i.coursename }}</option>
226 {% endfor %}
227 </select>
228 </td>
229 <td rowspan="2">
230 <select name="sunday_4">
231 {% for i in courselist %}
232 <option>{{ i.coursename }}</option>
233 {% endfor %}
234 </select>
235 </td>
236 </tr>
237 </table>
238 <input type="submit" value="提交" id='submit'>
239 <a href="/Mycurriculum/">
240 <button id='back'>返回</button>
241 </a>
242 </form>
这里还有一个地方需要注意，课程表中存在空的课。所以应该在model.py中这样设置：
1 class Course(models.Model):
2 coursename = models.CharField(verbose_name='课程名',max_length = 20,null=True,blank=True)
3 class Meta:
4 verbose_name_plural="课程名表"
models.py
null=True的话，数据库中该字段是NULL，即允许空值；null=False（默认）的话，数据库中该字段是NOT NULL，即不允许空值。
blank=False（默认）的话，字段没被赋值则会抛错；blank=True则不会。
1 monday_1 = request.POST.get('monday_1')
2 tuesday_1 = request.POST.get('tuesday_1')
3 wednesday_1 = request.POST.get('wednesday_1')
4 thursday_1 = request.POST.get('thursday_1')
5 friday_1 = request.POST.get('friday_1')
6 saturday_1 = request.POST.get('saturday_1')
7 sunday_1 = request.POST.get('sunday_1')
8
9 # bulk_create缺少主键,用for迭代数据表中的两个数据（id,coursename）,zip函数可以将多个可迭代对象封装成多元素的元组的列表，从而方便并行操作数据,这里将a、range（1,9）
10 courseonelist = []
11 a = [monday_1,tuesday_1,wednesday_1,thursday_1,friday_1,saturday_1,sunday_1]
12 for n,m in zip(a,range(1,9)):
13 obj1 = Courseone(
14 id = m,
15 coursename = n,
16 )
17 courseonelist.append(obj1)
18
19 monday_2 = request.POST.get('monday_2')
20 tuesday_2 = request.POST.get('tuesday_2')
21 wednesday_2 = request.POST.get('wednesday_2')
22 thursday_2 = request.POST.get('thursday_2')
23 friday_2 = request.POST.get('friday_2')
24 saturday_2 = request.POST.get('saturday_2')
25 sunday_2 = request.POST.get('sunday_2')
26
27 coursetwolist = []
28 a = [monday_2,tuesday_2,wednesday_2,thursday_2,friday_2,saturday_2,sunday_2]
29 for n,m in zip(a,range(1,9)):
30 obj2 = Coursetwo(
31 id = m,
32 coursename = n,
33 )
34 coursetwolist.append(obj2)
35
36 monday_3 = request.POST.get('monday_3')
37 tuesday_3 = request.POST.get('tuesday_3')
38 wednesday_3 = request.POST.get('wednesday_3')
39 thursday_3 = request.POST.get('thursday_3')
40 friday_3 = request.POST.get('friday_3')
41 saturday_3 = request.POST.get('saturday_3')
42 sunday_3 = request.POST.get('sunday_3')
43
44 coursethreelist = []
45 a = [monday_3,tuesday_3,wednesday_3,thursday_3,friday_3,saturday_3,sunday_3]
46 for n,m in zip(a,range(1,9)):
47 obj3 = Coursethree(
48 id = m,
49 coursename = n,
50 )
51 coursethreelist.append(obj3)
52
53 monday_4 = request.POST.get('monday_4')
54 tuesday_4 = request.POST.get('tuesday_4')
55 wednesday_4 = request.POST.get('wednesday_4')
56 thursday_4 = request.POST.get('thursday_4')
57 friday_4 = request.POST.get('friday_4')
58 saturday_4 = request.POST.get('saturday_4')
59 sunday_4 = request.POST.get('sunday_4')
60 coursefourlist = [monday_4,tuesday_4,wednesday_4,thursday_4,friday_4,saturday_4,sunday_4]
61
62 coursefourlist = []
63 a = [monday_4,tuesday_4,wednesday_4,thursday_4,friday_4,saturday_4,sunday_4]
64 for n,m in zip(a,range(1,9)):
65 obj4 = Coursefour(
66 id = m,
67 coursename = n,
68 )
69 coursefourlist.append(obj4)
70
71 try: #可能存在数据重复的问题
72 Courseone.objects.bulk_create(courseonelist)#用bulk_create将多条数据同时写入数据库
73 except:
74 Courseone.objects.all().delete() #先删再创建,无法使用update()批量更新
75 Courseone.objects.bulk_create(courseonelist)
76
77 try:
78 Coursetwo.objects.bulk_create(coursetwolist)
79 except:
80 Coursetwo.objects.all().delete()
81 Coursetwo.objects.bulk_create(coursetwolist)
82
83 try:
84 Coursethree.objects.bulk_create(coursethreelist)
85 except:
86 Coursethree.objects.all().delete()
87 Coursethree.objects.bulk_create(coursethreelist)
88
89 try:
90 Coursefour.objects.bulk_create(coursefourlist)
91 except:
92 Coursefour.objects.all().delete()
93 Coursefour.objects.bulk_create(coursefourlist)
Views.py
最后：
这是本人能想到的最好的办法了，方法虽然很笨，但还能算的上比较灵活。缺点很明显，这种方法只适用于小一点的表格，几行几列的那种。要是大表格的话，需要很多数据表。。。后端有会有很大的代码量。
如果有更好的办法，望请告知，如果我的文章能帮到你，不胜荣幸！
联系方式：微信18203416317
如何把整张表格的数据通过form表单的方式传回后台的更多相关文章
- 结合Bootbox将后台JSON数据填充Form表单
本文介绍了如何结合Bootbox将后台JSON数据填充到Form表单中,同时也介绍了一些需要使用的知识的学习途径,并附上了参考文档地址与学习网址,对此感兴趣的伙伴可以直接访问学习.为了方便介绍,使用了 ...
- jquery获取form表单内容以及绑定数据到form表单
在日常开发的过程中,难免会用到form表单,我们需要获取表单的数据保存到数据库,或者拿到后台的一串json数据,要将数据绑定到form表单上,这里我写了一个基于jquery的,formHelp插件,使 ...
- 关于form表单或者Ajax向后台发送数据时，数据格式的探究
最近在做一个资产管理系统项目,其中有一个部分是客户端向服务端发送采集到的数据的,服务端是Django写的,客户端需要用rrequests模块模拟发送请求 假设发送的数据是这样的: data = {'s ...
- django 使用form组件提交数据之form表单提交
django的form组件可以减少后台在进行一些重复性的验证工作,极大降低开发效率. 最近遇到一个问题: 当使用form表单提交数据后,如果数据格式不符合后台定义的规则,需要重新在前端页面填写数据. ...
- jQuery动态创建form表单并提交到后台(携带一定的数据进行页面跳转)
今天遇到这么一个需求,携带一个编号一个名字跳转到另一个JSP页面,直接页面跳转(get携带数据)的话不太安全,于是想到到后台转发一下. 第一种:直接以表单提交方式的进行 JS代码: var form ...
- PHP 输出表格单元格的数据之用表单的方式；
echo "<table border=1 class="imagetable" >"; //使用表格格式化数据echo "<for ...
- js中大数据量form表单卡顿问题解决
转载大神: http://www.mamicode.com/info-detail-1773696.html
- Django框架之第二篇--app注册、静态文件配置、form表单提交、pycharm连接数据库、django使用mysql数据库、表字段的增删改查、表数据的增删改查
本节知识点大致为:静态文件配置.form表单提交数据后端如何获取.request方法.pycharm连接数据库,django使用mysql数据库.表字段的增删改查.表数据的增删改查 一.创建app,创 ...
- fsLayuiPlugin数据表格弹出form表单说明
fsLayuiPlugin 是一个基于layui的快速开发插件,支持数据表格增删改查操作,提供通用的组件,通过配置html实现数据请求,减少前端js重复开发的工作. GitHub下载 码云下载 测试环 ...
随机推荐
- 十一. Go并发编程--singleflight
一.前言 1.1 为什么需要Singleflight? 很多程序员可能还是第一次听说,本人第一次听说这个的时候以为翻译过来就是程序设计中被称为的是 "单例模式". google之后 ...
- 5.基于二进制部署kubernetes(k8s)集群
1 kubernetes组件 1.1 Kubernetes 集群图 官网集群架构图 1.2 组件及功能 1.2.1 控制组件(Control Plane Components) 控制组件对集群做出全局 ...
- 【2020五校联考NOIP #6】三格缩进
题意: 给出 \(n\) 个数 \(a_1,a_2,\dots,a_n\),你要进行 \(m\) 次操作,每次操作有两种类型: \(1\ p\ x\):将 \(a_p\) 改为 \(x\). \(2\ ...
- Redis——面试官考题
总结: 本文在一次面试的过程中讲述了 Redis 是什么,Redis 的特点和功能,Redis 缓存的使用,Redis 为什么能这么快,Redis 缓存的淘汰策略,持久化的两种方式,Redis 高可用 ...
- MybatisPlus使用Wrapper实现查询功能
Wrapper---条件查询器 :使用它可以实现很多复杂的查询 几个案例 环境: 参照博客:MybatisPlus入门程序 1.条件查询 1.1 查询name不为空的用户,并且邮箱不为空的用户,年龄大 ...
- promise.all的应用场景举例
Promise.all方法 简而言之:Promise.all( ).then( )适用于处理多个异步任务,且所有的异步任务都得到结果时的情况. 比如:用户点击按钮,会弹出一个弹出对话框,对话框中有两部 ...
- 【leetcode】15. 3 Sum 双指针 压缩搜索空间
Given an integer array nums, return all the triplets [nums[i], nums[j], nums[k]] such that i != j, i ...
- ybatis中查询出多个以key,value的属性记录,封装成一个map返回的方法
可以采用值做映射,也可以不采用映射方式 <resultMap id="configMap" type="java.util.Map" > <r ...
- Largest Rectangle in Histogram及二维解法
昨天看岛娘直播解题,看到很经典的一题Largest Rectangle in Histogram 题目地址:https://leetcode.com/problems/largest-rectangl ...
- c学习 - 第八章：函数
8.7 数组作函数的参数 1.数组元素作函数的参数--值传递,单向传递 2.数组名做函数的参数--地址传送 (1)实参:数组名做实参,传递的是数组首元素的地址 (2)形参:使用同类型的数组名或指针变量 ...