如何在 Django 中使用 ajax 和 vanilla JavaScript 从 MultipleChoiceField 获取正确的值答案

【问题标题】：How to get correct values from MultipleChoiceField with ajax and vanilla JavaScript in Django如何在 Django 中使用 ajax 和 vanilla JavaScript 从 MultipleChoiceField 获取正确的值
【发布时间】：2020-11-28 07:39:52
【问题描述】：

forms.py

class MyForm(forms.ModelForm):

    AVAILABLE_OPTIONS = [
        ('a', 'a'),
        ('b', 'b'),
        ('c', 'c'),
    ]

    options = forms.MultipleChoiceField(
        ......
        widget=forms.CheckboxSelectMultiple(),
        choices=AVAILABLE_OPTIONS,
    )

JavaScript

....
var my_array = []
var options = document.querySelectorAll('input[name=options]:checked');
....

我想要什么：

<QueryDict: {'csrfmiddlewaretoken': ....., 'options': ['a', 'b', 'c', ....], ......}>

打印 request.POST 时得到的结果

<QueryDict: {........,    'options': ['[object NodeList]'],     .....}>

当我遍历 options 和 my_array.push(options[i].value) 时，我得到以下信息，并且表单不起作用，因为它是 1 个值，而不是多个值。

<QueryDict: {........,    'options': ['a, b, c'],     .....}>

我做错了什么？？

谢谢！

【问题讨论】：

使用FormData 对象可能会使您的代码更简单一些？ developer.mozilla.org/en-US/docs/Web/API/FormData/…
抱歉，还是不行。我继续得到的是NodeList。我知道这不是一个数组，所以我什至尝试了new Array()，但这也不起作用。
您能分享发出 POST 请求的其余代码吗？
感谢您的帮助，但我只是想通了。

标签： javascript arrays django ajax django-forms

【解决方案1】：

/掌心

我忘记了我所要做的就是在发布请求中使用相同的name 属性来获得我想要的结果。

xhr.send(`..... &options=${options[0].value}&options=${options[1].value}& ......`);

【讨论】：