前往小程序,Get更优阅读体验!
立即前往
首页
学习
活动
专区
工具
TVP
发布
社区首页 >专栏 >Django表单提交后实现获取相同name的不同value值

Django表单提交后实现获取相同name的不同value值

作者头像
砸漏
发布2020-11-02 10:33:33
3.8K0
发布2020-11-02 10:33:33
举报
文章被收录于专栏:恩蓝脚本

i前端:nput_test.html

代码语言:javascript
复制
<!DOCTYPE html 
<html 
<head lang="en" 
  <meta charset="UTF-8" 
  <title Search</title 
  <script 
 
  </script 
</head 
<body 
  <div <p {{ result }}</p </div 
  <form action="" method="post" {% csrf_token %}
    <input type="text" name="key" 
    <input type="text" name="key" 
    <input type="submit" value="Search"  
  </form 
</body 
</html 

两个<input 标签name都是’key’

后台:Django views.py

代码语言:javascript
复制
def setting(request):
  if request.method == 'POST':
    result_list = request.POST.getlist('key', '')
    result = str(result_list)
    return render_to_response('input_test.html', locals(), context_instance=RequestContext(request))
  else:
    return render_to_response('input_test.html', locals(), context_instance=RequestContext(request))

运行后,在浏览器表单中输入:

打开chrome ,提交表单,看FormData,其实浏览器已经向后台提交了两个name 为’key ‘的值。

后台也成功接收到一个列表 [‘1’, ‘2’]。

主要是这个API request.POST.getlist(),可以接收到所有共享同一个name的value,

QueryDict.getlist(key, default)¶ Returns the data with the requested key, as a Python list. Returns an empty list if the key doesn’t exist and no default value was provided. It’s guaranteed to return a list of some sort unless the default value was no list.

参考:http://stackoverflow.com/questions/14348321/getting-distinct-values-from-inputs-that-share-the-same-name

补充知识:django中form从后端查询回显到前端以及表单的提交到服务器操作

这个表格是我以下代码出现的效果,以下代码也可以实现图中修改保存删除操作。

1:首先你得创建一张表,在这里建表语句我就不再写了,再也简单不过了。(别忘了加点数据哦!)

2:将表的数据通过view.py的函数返回到前端。在这里stu是表名,将所有的返回结果all通过一个data字典传到前端的all里面去

代码语言:javascript
复制
def showstu(request):
  all=stu.objects.all()
  data={
    "all":all
  }

return render(request,"searchstu.html",context=data)

3:有数据我们就可以拿到前端来展示了。

4 :新建一个searchstu.html文件,用来展示用的。

这个是最简单的表用来提示用的

代码语言:javascript
复制
 <table border="1" cellpadding="0"  
      <tr  

      <td 姓名</td 
      <td 年龄</td 
      <td 性别</td 
      <td 班级</td 
      <td colspan="3" 操作</td 
      </tr 
</table 

这个表是实现我们的功能的表

{% for student in all %}

代码语言:javascript
复制
<form action="{% url 'homework:updatestu' %}" method="get"  
<table border="1" cellpadding="0" 
<tr <td 
 <input type="text" name="s_id" value={{student.id}} style="display:none" 
</td <td 
  <input type="text" name="s_name" value={{student.stu_name}}  
</td <td 
  <input type="text" name="s_age"value={{ student.stu_age}} 
</td <td 
  <input type="text" name="s_sex"value={{ student.stu_sex}} 
</td <td 
  <input type="text" name="s_cla" value={{ student.stu_class}} 
</td <td 
    <input type="button" id="a" value="修改" οnclick="update(this)" 

#在这里用了两种方法提交到服务器,一种是submit提交,还有一种是超链接提交。
</td <td <input type="submit" value="保存" οnclick="save(this)" 
</td <td <a href="/homework/delstu/{{ student.id }}" rel="external nofollow"  
   <input type="button" value="删除" </a 
</td </tr 
    </table 
    </form 

{% endfor %}

好了查询功能已经做好了我们可以通过url访问了

url(r”^showstu/”, views.showstu,name=”showstu”),

现在起要操作剩下的功能了,在这里的一个比较笨的办法,要想实现点击对应的按钮删除或者修改哪一个,就要把每行都设置成一个form提交表单。

因此我把form放在for循环内部,这样循环一条就会多一个form表单。

5:实现提交后后端的处理函数,通过get获取。

更新操作

代码语言:javascript
复制
def updatestu(request):
  id = request.GET.get("s_id")
  name=request.GET.get("s_name")
  sex=request.GET.get("s_sex")
  age=request.GET.get("s_age")
  cla=request.GET.get("s_cla")

#获取数据库中这个id将和这个id有关的数据设置成你get到前面的值,别忘记保存!修改完后直接刷新这个页面也就是重定向到这个页面

  stu1=stu.objects.filter(pk=id).first()
  stu1.stu_age=age
  stu1.stu_class=cla
  stu1.stu_sex=sex
  stu1.stu_name=name
  stu1.save()
  return HttpResponseRedirect("/homework/showstu")

删除操作

代码语言:javascript
复制
def delstu(request,id):
  stu1=stu.objects.filter(pk=id).first()
  stu1.delete()
  return HttpResponseRedirect("/homework/showstu")

以上这篇Django表单提交后实现获取相同name的不同value值就是小编分享给大家的全部内容了,希望能给大家一个参考。

本文参与 腾讯云自媒体同步曝光计划,分享自作者个人站点/博客。
原始发表:2020-09-11 ,如有侵权请联系 cloudcommunity@tencent.com 删除

本文分享自 作者个人站点/博客 前往查看

如有侵权,请联系 cloudcommunity@tencent.com 删除。

本文参与 腾讯云自媒体同步曝光计划  ,欢迎热爱写作的你一起参与!

评论
登录后参与评论
0 条评论
热度
最新
推荐阅读
相关产品与服务
云服务器
云服务器(Cloud Virtual Machine,CVM)提供安全可靠的弹性计算服务。 您可以实时扩展或缩减计算资源,适应变化的业务需求,并只需按实际使用的资源计费。使用 CVM 可以极大降低您的软硬件采购成本,简化 IT 运维工作。
领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档