zoukankan      html  css  js  c++  java
  • [oldboy-django][2深入django]后台生成form标签并设置标签的属性

    # Form生成html标签
        a. 通过Form生成Input输入框,Form标签,以及submit标签还是要在前端写的,
            但是Form标签内的Input标签可以在后台实现;只需要按以下步骤
            - views定义StudentForm(Form)类
            - views视图函数将Form实例化对象传递给前端
            - 前端{{ obj.段 }}即可
    
        b. 通过Form设置前端Input的type属性,即设置不同类型的输入框
            # 设置name为text, cls_id为下拉框
            class StudentForm(Form):
                name = fields.CharField(widget= widgets.InputText())
                cls_id = fields.IntegerField(widget = widgets.Select())
    
        c. 设置下拉框的内容choices属性
            class StudentForm(Form):
                cls_id = fields.IntegerField(
                    widget=widgets.Select(choices=models.Classes.objects.values_list('id', 'title'))
                )
            注意: choices的值必须[元组,(), ()]类型
            widget=widgets.Select(choices=[(1, '上海'), (2,'北京')])
    
        d.设置input输入框的class属性 -- attrs
            name = fields.CharField(max_length=8, min_length=2,
                            widget=widgets.TextInput(attrs={'class': 'form-control'})
                            )
            cls_id = fields.IntegerField(
                    widget=widgets.Select(
                                            choices=models.Classes.objects.values_list('id', 'title'),
                                            attrs={'class': 'form-control'}
                                        )
                )
    
            注意: attrs参数必须放在TextInput或者Select等内部,而且值必须为字典
    
        e. 通过Form设置前端Input的默认显示值
            只要在视图函数将实例化一个Form对象,并且设置initial值即可
                student_dict = models.Student.objects.filter(id=nid).values('name', 'age', 'email', 'cls_id').first()
                obj = StudentForm(initial=student_dict)
  • 相关阅读:
    js的6种继承方式
    将数组分割成指定长度的小数组
    input file样式美化
    css伪类和伪元素的区别,:before和::before的区别
    css实现垂直居中
    css实现中间文字,两边横线效果
    css中:not()选择器和jQuery中.not()方法
    jQuery中判断input的disabled属性
    jQuery中判断input的checked属性
    HMTL label标签
  • 原文地址:https://www.cnblogs.com/liuzhipenglove/p/7873647.html
Copyright © 2011-2022 走看看