Django开发中复选框用法示例


Posted in Python onMarch 20, 2018

本文实例讲述了Django开发中复选框用法。分享给大家供大家参考,具体如下:

一、查询数据库遍历所有的复选框

1、python查询数据库所有的tag

# 新增文章
def add(request):
  if request.method == 'GET':
    tags = TagModel.objects.all()
    return render(request, 'books_add.html', {'tags': tags})
  elif request.method == 'POST':
    title = request.POST.get('title', None)
    content = request.POST.get('content', None)
    blogModel = BlogModel(title=title, content=content, author=AuthorModel.objects.get(id=1))
    blogModel.save()
    # 获取复选框的值,是一个选中的数组
    tags = request.POST.getlist('tags')
    # 循环遍历所有选中的复选框,利用多对多的关系追加到数据库
    for tag in tags:
      blogModel.tag.add(tag)
    return HttpResponseRedirect('book_add')
  else:
    return HttpResponse(u'是不被处理的请求方式')

2、前端页面

<div class="form-group">
  <label class="col-sm-2 control-label">标签</label>
  <div class="col-sm-9">
    {% for tag in tags %}
      <label class="checkbox-inline">
        <input value="{{ tag.id }}" type="checkbox" name="tags"/>{{ tag.name }}
      </label>
    {% endfor %}
  </div>
</div>

3、进入编辑页面,先获取全部的复选框及选中的id

# 编辑博客
def edit(request, blog_id):
  tags = TagModel.objects.all()
  # 利用正向查找关于本博客选择的tag
  blogModel = BlogModel.objects.filter(id=blog_id).first()
  # 获取全部的tag
  check_tag = blogModel.tag.all()
  # 获取选中的id
  check_id = [int(x.id) for x in check_tag]
  print check_id
  return render(request, 'books_edit.html', {'tags': tags, 'check_id': check_id})

4、判断如果选中的就勾选

<div class="form-group">
  <label class="col-sm-2 control-label">标签</label>
  <div class="col-sm-9">
    {% for tag in tags %}
      {% if tag.id in check_id %}
        <label class="checkbox-inline">
          <input value="{{ tag.id }}" type="checkbox" name="tags" checked="checked"/>{{ tag.name }}
        </label>
      {% else %}
        <label class="checkbox-inline">
          <input value="{{ tag.id }}" type="checkbox" name="tags"/>{{ tag.name }}
        </label>
      {% endif %}
    {% endfor %}
  </div>
</div>

二、ajax提交的时候注意要把复选框转换字符串提交

1、前端代码

$('#btn').on('click', function (e) {
  // 设置空数组
  var hobby = [];
  $('#hobby-group').find('input[type=checkbox]').each(function () {
 if ($(this).prop("checked")) {
   var hobbyId = $(this).val();
   hobby.push(hobbyId);
 }
  })
  console.log(hobby);
  $.ajax({
 'url': '/ajaxpost/',
 'method': 'post',
 'data': {
   'username': $('.username').val(),
   'hobby': hobby
 },
 'traditional': true,
 'beforeSend': function (xhr, settings) {
   var csrftoken = ajaxpost.getCookie('csrftoken');
   //2.在header当中设置csrf_token的值
   xhr.setRequestHeader('X-CSRFToken', csrftoken);
 },
 'success': function (data) {
   console.log(data);
 }
  })
})

2、后端代码

@require_http_methods(['POST'])
def ajaxpost(request):
  form = LoginForm(request.POST)
  if form.is_valid():
    username = form.cleaned_data.get('username', None)
    # 获取复选框的值
    hobby = request.POST.getlist('hobby')
    print '*' * 100
    print hobby
    print '*' * 100
    return HttpResponse(u'成功')
  else:
    return HttpResponse(u'验证错误')

希望本文所述对大家Django框架的Python程序设计有所帮助。

Python 相关文章推荐
python实现在sqlite动态创建表的方法
May 08 Python
Python的装饰器用法学习笔记
Jun 24 Python
Python中使用支持向量机(SVM)算法
Dec 26 Python
Python 25行代码实现的RSA算法详解
Apr 10 Python
利用Python将每日一句定时推送至微信的实现方法
Aug 13 Python
详解Python字符串切片
May 20 Python
Python中类似于jquery的pyquery库用法分析
Dec 02 Python
python opencv如何实现图片绘制
Jan 19 Python
keras 指定程序在某块卡上训练实例
Jun 22 Python
pandas实现导出数据的四种方式
Dec 13 Python
Python基础之hashlib模块详解
May 06 Python
Python实现归一化算法详情
Mar 18 Python
python如何通过twisted实现数据库异步插入
Mar 20 #Python
分分钟入门python语言
Mar 20 #Python
python使用生成器实现可迭代对象
Mar 20 #Python
浅谈Python中的作用域规则和闭包
Mar 20 #Python
python如何实现反向迭代
Mar 20 #Python
python利用高阶函数实现剪枝函数
Mar 20 #Python
python flask中静态文件的管理方法
Mar 20 #Python
You might like
探讨:使用XMLSerialize 序列化与反序列化
2013/06/08 PHP
php实现字符串首字母大写和单词首字母大写的方法
2015/03/14 PHP
Yii2超好用的日期和时间组件(值得收藏)
2016/05/05 PHP
PHP四种排序算法实现及效率分析【冒泡排序,插入排序,选择排序和快速排序】
2018/04/27 PHP
xml分页+ajax请求数据源+dom取结果实例代码
2008/10/31 Javascript
下载网站打开页面后间隔多少时间才显示下载链接地址的代码
2010/04/25 Javascript
javascript 判断数组是否已包含了某个元素的函数
2010/05/30 Javascript
js如何判断用户是否是用微信浏览器
2014/06/05 Javascript
使用JavaScript进行进制转换将字符串转换为十进制
2014/09/21 Javascript
jquery实现炫酷的叠加层自动切换特效
2015/02/01 Javascript
BootstrapValidator超详细教程(推荐)
2016/12/07 Javascript
简单实现js浮动框
2016/12/13 Javascript
全面解析vue中的数据双向绑定
2017/05/10 Javascript
JQuery判断radio单选框是否选中并获取值的方法
2019/01/17 jQuery
解决vue-cli项目开发运行时内存暴涨卡死电脑问题
2019/10/29 Javascript
vue之debounce属性被移除及处理详解
2019/11/13 Javascript
JS实现放烟花效果
2020/03/10 Javascript
jQuery--遍历操作实例小结【后代、同胞及过滤】
2020/05/22 jQuery
maptalks+three.js+vue webpack实现二维地图上贴三维模型操作
2020/08/10 Javascript
测试、预发布后用python检测网页是否有日常链接
2014/06/03 Python
使用Python为中秋节绘制一块美味的月饼
2019/09/11 Python
python查看数据类型的方法
2019/10/12 Python
python golang中grpc 使用示例代码详解
2020/06/03 Python
详解CSS3的box-shadow属性制作边框阴影效果的方法
2016/05/10 HTML / CSS
泰国折扣酒店预订:Hotels2Thailand
2018/03/20 全球购物
小橄榄树:Le Petit Olivier
2018/04/23 全球购物
国外的一些J2EE面试题一
2012/10/13 面试题
竞争性谈判邀请书
2014/02/06 职场文书
《争吵》教学反思
2014/02/15 职场文书
教师业务培训方案
2014/05/01 职场文书
银行会计主管岗位职责
2014/10/01 职场文书
贪污受贿检讨书范文
2014/11/19 职场文书
2015年生产车间工作总结
2015/04/22 职场文书
2015年房产经纪人工作总结
2015/05/15 职场文书
四十年同学聚会致辞
2015/07/28 职场文书
Python绘制散点图之可视化神器pyecharts
2022/07/07 Python