繁体   English   中英

渲染django形式multiplechoice

Render django form multiplechoice

提示:本站收集StackOverFlow近2千万问答,支持中英文搜索,鼠标放在语句上弹窗显示对应的参考中文或英文, 本站还提供   中文繁体   英文版本   中英对照 版本,有任何建议请联系yoyou2525@163.com。

我一直在网上搜索如何将颜色/主题应用于django中的复选框表单项,但找不到如何操作。

我想做的事情可能很简单,但是尽管所有主题和博客都是红色的,我仍然无法做到。

所以这是我的表格简化:

class MyForm(forms.Form):

    def __init__(self, data, *args, **kwargs):
        super(MyForm, self).__init__(data, *args, **kwargs)
        self.fields['checkbox'] = forms.MultipleChoiceField(
            label='Set of questions to know you better',
            required=True,
            widget=forms.CheckboxSelectMultiple(attrs={'disabled': 'disabled'}),
            choices=((1, 'Proposition 1'), (2, 'Proposition 2'), (3, 'Proposition 3'), (4, 'Proposition 4')),
            initial=(1, 2, 4,)
            )

而且我想知道如何修改我目前看起来的html

<form action="{% url 'dummy' %}" method="post">

    {% csrf_token %}
    {{ form.as_p }}

</form>

所以初始设置为True的所有选项都有一个给定的css应用于它们,而那些设置为False的另一个选择。

希望我的问题有道理。 如果没有,请不要犹豫。

最好:

埃里克

添加当前渲染: 在此输入图像描述

编辑:添加生成的HTML

<form action="/dummy" method="post">

    <input type='hidden' name='csrfmiddlewaretoken' value='LGZ0mwqrAKxb7CzFvOyYIyUIcDSARy4iwEtHVDjKPpnBd1AIXlk4UyxRuCSIEviY' />
    <p><label>Set of questions to know you better :</label> <ul id="id_checkbox">
    <li><label for="id_checkbox_0"><input type="checkbox" name="checkbox" value="1" disabled="disabled" id="id_checkbox_0" checked />
 Proposition 1</label>

</li>
    <li><label for="id_checkbox_1"><input type="checkbox" name="checkbox" value="2" disabled="disabled" id="id_checkbox_1" checked />
 Proposition 2</label>

</li>
    <li><label for="id_checkbox_2"><input type="checkbox" name="checkbox" value="3" disabled="disabled" id="id_checkbox_2" />
 Proposition 3</label>

</li>
    <li><label for="id_checkbox_3"><input type="checkbox" name="checkbox" value="4" disabled="disabled" id="id_checkbox_3" checked />
 Proposition 4</label>

</li>
</ul></p>

</form>
3 个回复

如果你需要设置检查输入的样式,你可以使用CSS伪类:checked ,这样:

input:checked {
  /*some code here */
}

但是,如果您需要有条件地将类添加到输入中,则可以在实例化表单的视图中执行此操作并覆盖create_option方法,但我认为创建自定义模板标记并使用它更容易。 您可以尝试以下内容:

from django import template

@register.filter
def add_css(checkbox_input):
    checkbox_input.data['attrs'].update({"class":"your-class"})
    return checkbox_input

然后在模板中

{% for x in form.checkbox %}
    {% if x.data.selected %}
        {{ x|add_css }}
    {% else %}
       {{ x }}
    {% endif %}
{% endfor %}

尝试基于CheckboxSelectMultiple创建一个新的Widget,覆盖create_option方法。

如果选择了选项,则添加新的类属性。

def create_option(self, name, value, label, selected, index, subindex=None, attrs=None):
    [..]
    if selected:
        option_attrs.update(self.checked_attribute)
        # add your class here to option_attrs
    [..]

好的,您也可以使用jQuery或vanilla js动态添加类,因为我总是使用jQuery(你也应该使用它,它的代码比vanilla js少得多)我将提供jQuery解决方案:

<script "src={% static 'jquery.js' %}" type="text/javascript"></script> // provide path to jquery or use cdn, whatever just add jquery
<script>
$(document).ready(function() {
    // On document ready add relevant classes to each checkbox
    $('input[name=checkbox]').each(function(){
        if($(this).is(':checked')){
            $(this).addClass('checked');
        }
        else{
          $(this).addClass('unchecked');
        }
        console.log(this);
    });
    // On checkbox change, remove classes and add new class based on if its checked or not
    $('input[name=checkbox]').change(function(){
        $(this).removeClass('checked unchecked');
        if($(this).is(':checked')){
            $(this).addClass('checked');
        }
        else{
            $(this).addClass('unchecked');
        }
        console.log(this);
    });
});
</script>

jsFiddle演示。

1 在Django中获取表单MultipleChoice的Queryset值

我想在表单中的Queryset中显示一个以上的值,但无法获取这些值。 我试图使用forms.locations.all并遍历它们。 forms.locations.1看起来可以使用,但是forms.locations.1.name forms.locations.1.street也不起作 ...

2 检索Django隐藏的MultipleChoice表单字段值

我有一个像这样的ModelForm : 当我使用此表单更新模型时,已经用以前的值填充了many_keys ,但是与非隐藏字段不同,getlist以1个字符串的列表形式返回值,而不是返回主键列表。 实际上,在HTML中,隐藏字段是这样表示的,这可能是问题的根源 如果我删除wi ...

3 从Django形式调用函数而不渲染其视图

使用Django,我想创建一个网站 如果单击按钮,则会在服务器中调用一个函数。 我还希望满足以下条件: 单击按钮后,将不会重新渲染页面。 简而言之,我想在服务器中单击按钮并运行python脚本。 我已经如下创建了按钮和调用功能脚本,但是它会导致错误,因为返回 ...

4 以 Django 模型形式多次渲染特定字段

我正在学习 django 并遇到了挑战。 我有一个模型,我想根据用户想要填写的数量多次呈现特定字段,而其余的模型字段保持不变。 下面是一个示例模型。 我想以这样的方式呈现模型表单,即字段'building'和'tour_date'可以根据需要重复多次,而'client_name'和'client_e ...

6 以django形式渲染外国字段

我有一个模型,其中一个字段引用另一个模型的外键: 父模型也很简单: 现在,我试图以一种形式呈现记录,为此我使用的是django-crispy-forms 。 所以我有: image_type字段呈现为完美的下拉列表,但不是图像类型的名称,条目都标记为ImageTypeM ...

7 无法从 django 中的数据库渲染旋转木马中的图像?

我正在尝试将图像从我的数据库渲染到 Django 中的轮播。 我有一个包含 url 字段来存储图像 url 的模型,但是当我在(template.html)我的 carousel img src 中使用它们时,它只呈现第一个图像而不是其他图像,即使我在数据库中存储了三个图像 url。 为了更好地理解 ...

9 以Django形式覆盖RadioSelect渲染会产生意外结果

我想在Django中覆盖RadioSelect的渲染。 (我已经做了复选框类似的事情,我想这两个看起来相同)。 造成这种情况的一般工作流程是写一个自定义渲染,然后更改ChoiceInput渲染,但是当我复制现有的代码并运行它的HTML输出是不是安全的,转义的HTML字符串显示。 这没有任何 ...

暂无
暂无

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2022 STACKOOM.COM