Django系列之form渲染表单后css样式丢失

最通用的form写法

我们经常看各大网站上写这样的form写法

class SYSAdminPhysicalForm(forms.ModelForm):
    ‘‘‘
    this form for idc‘s admin
    ‘‘‘
    class Meta:
        model = models.Machinepro
        exclude = ["m_inside_ip","m_outside_ip","order"]

    business_unit = forms.CharField(required=False,label="所属业务",disabled=True,)
    def __init__(self, *args, **kwargs):
        super(SYSAdminPhysicalForm, self).__init__(*args, **kwargs)
        for field_name in self.base_fields:
            field = self.base_fields[field_name]

            if field_name in ["m_ipmi_user","m_ipmi_passwd"]:
                field.widget.attrs.update({‘class‘: ‘form-control‘})
            else:
                field.widget.attrs.update({‘class‘: ‘form-control‘,"disabled":True})

写完这个form后,你重启django后第一次通过浏览器打开这个form表单,你会发现css样式是丢失的,特别是我那个disabled属性,一旦丢失,别人就可以修改我的表单了,所以后果非常严重。所以需要采取下面的方法来纠正这个bug

方法1:__new__写法

__init__是实例初始化执行,那么我们就改成实例化的时候执行,也就是使用new

    def __new__(cls, *args, **kwargs):
        obj = super(SYSAdminPhysicalForm, cls).__new__(cls,*args, **kwargs)
        for field_name in obj.base_fields:
            field = obj.base_fields[field_name]

            if field_name in ["m_ipmi_user","m_ipmi_passwd"]:
                field.widget.attrs.update({‘class‘: ‘form-control‘})
            else:
                field.widget.attrs.update({‘class‘: ‘form-control‘,"disabled":True})

方法2:fields 替换掉base_fields

这个最简单了,把base_fields直接用fields替换就解决了


    def __init__(self, *args, **kwargs):
        super(SYSAdminPhysicalForm, self).__init__(*args, **kwargs)
        for field_name in self.fields:
            field = self.fields[field_name]

            if field_name in ["m_ipmi_user","m_ipmi_passwd"]:
                field.widget.attrs.update({‘class‘: ‘form-control‘})
            else:
                field.widget.attrs.update({‘class‘: ‘form-control‘,"disabled":True}) 

任选一种方法后,任凭django重启多少回,不管你第几次打开表单页面,都不会丢失css样式啦!

时间: 2024-09-30 06:55:54

Django系列之form渲染表单后css样式丢失的相关文章

html表单输入框css样式美化特效源代码下载

html表单输入框css样式美化源代码,响应鼠标动作 原文:html表单输入框css样式美化特效源代码下载 源代码下载地址:http://www.zuidaima.com/share/1550463335926784.htm 源代码截图:

Form提交表单后页面刷新不跳转的实现

<form action="" id="" method="post" target="nm_iframe"> <input type="text" id="input_text" name="input_text"/> <input type="submit" id="sobmit" name=&

前端html表单与css样式

h2 { background-color: green } 1,from标签 from标签的功能是向服务器传输数据,实现用户交互的重要标签. from标签的具体使用: input标签使用示例: <from action="" method="post"> <p>姓名:<input type="text" name="names"> </p> <p>用户名:<i

Django框架开发中避免表单重复提交

Form表单做为web2.0时代的重要角色,也是我们与web网站进行数据交互的重要渠道,但是大家在web网站开发过程中,都会遇到一个问题,那就是如何避免表单重复提交,我们可不确定用户可在提交了一个表单后,是否有足够的耐心等待我们的程序加载完成,如果此时用户不耐烦的在前台重复刷新页面,那么就会造成数据重复提交.信息不准确,因此我们在程序设计时一定要规避这样的问题,接下来介绍一下在Django框架开发中如何避免此问题. 首先说明一下Http协议中两种非常常见的方法GET和POST. 1.GET方法往

ExtJs 第二章,Ext.form.Basic表单操作

1.认识Ext.form.Panel表单面板         Ext.form.field.CheckBox 复选框 checkboxfield Ext.form.CheckBoxGroup 复选框组 checkboxgroup Ext.form.field.ComboBox 下拉列表框 combo Ext.form.field.Date 日期选择框 datefield Ext.form.field.Display 文本展示组件 displayfield Ext.form.FieldContai

Form Presonalization 表单个性化定义控制应用

1.1.1   表单个性化定义 Oracle EBS 11.5.10所增加的Form Presonalization功能,是在对Form不进行开发的前提下,用一些系统内置的触发器,按照所设定的控制规则及条件逻辑,改变Form的标准功能,从而实现对部分功能个性化控制的目的. 如下是使用"Form Presonaliza"应用的系统功能案例,在本文内只做参考,供浏览者拓展业务需求解决方案所需. 具体内容可参见ST.SUN编制的系列文档 Oracle ERP知识学习总结(一): <Fo

我教女朋友学编程Html系列(6)—Html常用表单控件

做过网页的人都知道,html表单控件十分重要.基本上我们注册会员.登录用户,都需要填写用户名.密码,那些框框都是表单控件. 本来今天就想写一些常用的html表单控件,于是开始搜资料,找到了一个网页,作者的写作思路和我的基本相同,不过不足的是缺少效果图. 我打算结合着这位仁兄的文章补充一下,增加一些效果图,另外把一些新内容也补充进去,原文的地址是: HTML表单(Forms) 我站在这位仁兄的肩膀上写作,再增加一些东西,配上一些图,我想,效果应该很好,接着就跟着我来学习吧. HTML表单(Form

form提交表单上传图片

上传图片后将图片显示在当前页面上,本打算用ajax,但是上传图片必须设置 enctype="multipart/form-data",而要提交之后页面不跳转,所以查资料后采用form+iframe的方式.空的iframe并且不显示,将form的target设置为iframe,就会提交到iframe上,从而实现不刷新页面上传. <form name="uploadForm" id="uploadForm" method="post&

js日期/时间比较函数,以及js校验表单后提交表单的三种方法,表单验证,以及三种结合

<pre class="html" name="code"> js日期比较(yyyy-mm-dd) function duibi(a, b) { var arr = a.split("-"); var starttime = new Date(arr[0], arr[1], arr[2]); var starttimes = starttime.getTime(); var arrs = b.split("-");