将额外数据添加到Django表单下拉选择中

5

我有一个Action模型,其中包含一个外键,用于指定一个动作的重复次数:

class Reoccurance(models.Model):
    label = models.CharField("Label", max_length=50, unique = True)
    days = models.IntegerField("Days")

    def __unicode__(self):
        return self.label

    class Meta:
        ordering = ['days']

class Action(models.Model):
    name = models.CharField("Action Name", max_length=200, unique = True)
    complete = models.BooleanField(default=False, verbose_name="Complete?")
    reoccurance = models.ForeignKey(Reoccurance, blank=True, null=True, verbose_name="Reoccurance")

我正在创建一个 Action 的 modelForm,其会生成基于 Reoccurance 表中存在的数据库值的 HTML 代码:

<select id="id_reoccurance" class="select" name="reoccurance">
    <option value="" selected="selected">---------</option>
    <option value="12">2 Days</option>
    <option value="1">3 Days</option>
    <option value="2">5 Days</option>
    <option value="10">6 Days</option>
    <option value="9">1 Week</option>
    <option value="3">10 Days</option>
    <option value="4">2 Weeks</option>
    <option value="11">3 Weeks</option>
    <option value="5">1 Month</option>
    <option value="13">6 Weeks</option>
    <option value="6">1 Quarter</option>
    <option value="7">6 Months</option>
    <option value="8">1 Year</option>
</select>

正如您所看到的,虽然选择是按照升序排列的,但是这些值是无序的,因为它们是按照顺序输入到数据库中的。
我想创建一些jQuery代码,动态计算操作将重新发生的日期。它将获取今天的日期,并添加与用户选择相对应的天数。但是,使用表单中获得的数据,我无法将选择转换为一组天数。即使选项项目的值是有序的,也不能表示例如“1年”等于365天。
但是,这些数据在Reoccurance表中。对于标签=“1年”,天数= 365。同样适用于Reoccurance表中的所有项目。
是否有一种方法可以重写我的modelForm,以便每个下拉项的选项值等于该选择的天数?因为那样,我就可以访问天数:
$("#id_reoccurance").change(function() {
    alert( $(this).val() );
});

这会不会对我将正确的重复选择项与重复表的正确行相对应的能力产生负面影响?在我的表单模板中,是否有其他方法可以使用jquery访问这些天数/标签关联?

更新

感谢Joseph建议检查此帖子,我能够在我的选项元素中包含一个标题:

from django.utils.html import conditional_escape, escape
from django.utils.encoding import force_unicode

class SelectWithTitles(forms.Select):
    def __init__(self, *args, **kwargs):
        super(SelectWithTitles, self).__init__(*args, **kwargs)
        # Ensure the titles dict exists
        self.titles = {}

    def render_option(self, selected_choices, option_value, option_label):
        title_html = (option_label in self.titles) and \
            u' title="%s" ' % escape(force_unicode(self.titles[option_label])) or ''
        option_value = force_unicode(option_value)
        selected_html = (option_value in selected_choices) and u' selected="selected"' or ''
        return u'<option value="%s"%s%s>%s</option>' % (
            escape(option_value), title_html, selected_html,
            conditional_escape(force_unicode(option_label)))

class ChoiceFieldWithTitles(forms.ChoiceField):
    widget = SelectWithTitles

    def __init__(self, choices=(), *args, **kwargs):
        choice_pairs = [(c[0], c[1]) for c in choices]
        super(ChoiceFieldWithTitles, self).__init__(choices=choice_pairs, *args, **kwargs)
        self.widget.titles = dict([(c[1], c[2]) for c in choices])

class ActionForm(forms.ModelForm):
    reoccurance = ChoiceFieldWithTitles()

    def __init__(self, *args, **kwargs):
        super(ActionForm, self).__init__(*args, **kwargs)   

        choices = []
        for pt in Reoccurance.objects.all():
            choices.append((pt.id, pt.label, pt.days))
        self.fields['reoccurance'] = ChoiceFieldWithTitles(choices = choices)

太好了。现在我在模板中得到以下内容:
<select id="id_reoccurance" class="selectwithtitles" name="reoccurance">
    <option value="12" title="2" >2 Days</option>
    <option value="1" title="3" >3 Days</option>
    <option value="2" title="5" >5 Days</option>
    <option value="10" title="6" >6 Days</option>
    <option value="9" title="7" >1 Week</option>
    <option value="3" title="10" >10 Days</option>
    <option value="4" title="14" >2 Weeks</option>
    <option value="11" title="21" >3 Weeks</option>
    <option value="5" title="30" >1 Month</option>
    <option value="13" title="42" >6 Weeks</option>
    <option value="6" title="90" >1 Quarter</option>
    <option value="7" title="180" >6 Months</option>
    <option value="8" title="365" >1 Year</option>
</select>

好的,看起来我们已经快完成了,但是我有些困惑。在jquery中,我尝试使用以下代码来获取所选选项的标题:

$(function() {
    $("#id_reoccurance").change(function() {
        alert($(this).attr('title'));
    }); 
});

问题是它返回为未定义!

更新明白了

$(function() {
    $("#id_reoccurance").change(function() {
        alert($(this).find("option:selected").attr("title"));
    }); 
});

我相信你可以在表单的__init__()函数中将数据放入表单字段的属性中,但由于你不仅仅是在一个输入小部件上进行设置,而是在多个<option>元素上进行设置,所以我对具体的方法并不确定。 - Joseph
我已找到了一般解决方案,适用于 Django 2.+,并允许在选项中添加标题和其他内容,请参见 https://dev59.com/tm445IYBdhLWcg3wAFi0#56097149。 - Edouard Thiel
1个回答

2

参考这个问题/答案(这是初步版本,未经过测试,希望能帮到你):

class myClassForm(forms.Form):
    class Meta:
        model = myClass
        fields=["name"]

    reoccurrance = forms.ChoiceField(label="Reoccurance", choices=(),
                                   widget=forms.Select(attrs={'class':'selector'}))


def __init__(self, *args, **kwargs):
    super(myClassForm, self).__init__(*args, **kwargs)
    choices = []
    for pt in Reoccurance.objects.all():
      choices.append((pt.id, unicode(pt.days)))
    self.fields['reoccurrance'].choices = choices

我也是这么想的。但有几个问题:我希望每个选择的文本都是“标签”。所以,我尝试使用choices.append((unicode(pt.days), pt.label))。但这让我遇到了我预料中的问题。模型期望选择的值等于id,而不是天数。因此,当它尝试将用户选择与数据库中的id对齐时,最好的情况是显示所选内容与返回内容不匹配。在最坏的情况下,它会说没有与用户选择相匹配的Reoccurance表中的条目(例如,没有等于365的id)。 - Ed.
1
请看这个链接:https://dev59.com/tm445IYBdhLWcg3wAFi0 - Joseph
太好了!谢谢!!这样可以将日期存入模板中。但现在怎样才能从所选的选项中取出日期呢?请参见上面的修改。 - Ed.

网页内容由stack overflow 提供, 点击上面的
可以查看英文原文,
原文链接