django multi select field saves only one value

Question

I have a form that you can select a province and its' cities. This is the model that my form is using in my app:

class ScientificSchedule(models.Model):
    user = models.ForeignKey(User, on_delete=models.CASCADE)
    province = models.CharField(max_length=100, blank=True)
    city = models.CharField(max_length=2048, blank=True)
    #other fields

and the form:

class ScientificScheduleForm(forms.ModelForm):

    class Meta:
        model = ScientificSchedule
        fields = '__all__'

also these are my views and HTML code:

class ScientificScheduleView(FormView):
    model = ScientificSchedule
    template_name = 'reg/scientific-schedule.html'
    form_class = ScientificScheduleForm
    success_url = '/scientific/schedule'

    def post(self, request):
        form = ScientificScheduleForm(request.POST)
        if form.is_valid():
            return self.form_valid(form)
        else:
            return self.form_invalid(form)

    def form_valid(self, form):
        form.save()
        return super(ScientificScheduleView, self).form_valid(form)

and this is part of the form which is for city and province fields:

<form id="manager-users" method="POST" autocomplete="off" class="ant-form ant-form-horizontal">
{% csrf_token %}

<div class="ant-row-flex ant-row-flex-space-between" style="margin-left: -10px; margin-right: -10px;">
    <div class="ant-col ant-col-xs-24 ant-col-md-12" style="padding-left: 10px; padding-right: 10px;">
        <div class="ant-row ant-form-item formItemRow">
            <div class="ant-col ant-form-item-label"><label for="province" class="ant-form-item-required" title="province">province</label></div>
            <div class="ant-col ant-form-item-control-wrapper">
                <div class="ant-form-item-control has-success">
                    <span class="ant-form-item-children">
                        <div id="province" class="ant-select ant-select-selection ant-select-selection--single" style="width: 100%;">
                            <select name="province" class="ant-col ant-select-selection ant-select-selection--single" role="combobox" aria-autocomplete="list" aria-haspopup="true" tabindex="-1">
                                <option value="" class=""> - </option>
                            </select>
                        </div>
                    </span>
                </div>
            </div>
        </div>
    </div>
    <div class="ant-col ant-col-xs-24 ant-col-md-12" style="padding-left: 10px; padding-right: 10px;">
        <div class="ant-row ant-form-item formItemRow">
            <div class="ant-col ant-form-item-label"><label for="city" class="ant-form-item-required" title="city">city</label></div>
            <div class="ant-col ant-form-item-control-wrapper">
                <div class="ant-form-item-control has-success">
                    <span class="ant-form-item-children">
                        <div id="city" class="ant-select ant-select-selection ant-select-selection--single" style="width: 100%;">
                            <select multiple name="city" class="ant-col ant-select-selection ant-select-selection--single" role="combobox" aria-autocomplete="list" aria-haspopup="true" tabindex="-1" id="set-multi">
                                <option value="" class="" selected> - </option>
                            </select>
                        </div>
                    </span>
                </div>
            </div>
        </div>
    </div>
    <div style="display: flex; justify-content: flex-end; margin-top: 1rem;">
        <input id="btn_submit" type="submit" value="submit" class="ant-btn ant-btn-primary" />
    </div>
</div>

the cool thing about these fields is that the city field will only show cities inside the chosen province. So, at first, the user cant pick cities, they have to select one province and then choose 1, some, or all of the cities. however, submitting the form only saves the last option I chose for the city. For instance, I choose city1, city4, and city5 but only city5 is saved. how can I save this field like a list? I want to save ['city1','city4','city5'] in the city field of my model. thank you for your responses

well, I'm using a Django form to take care of my post requests, so I don't think this is helpful. — Sam, Jun 19 '22 at 11:51
have you tried to use `request.POST.getlist('city')` inside `post` method of the `ScientificScheduleView` class? — K4liber, Jun 19 '22 at 12:36

score 1 · Accepted Answer · answered Jun 19 '22 at 11:52

1

Hard to tell you what you exactly need to do, but I believe on your ScientificSchedule model you only have 1 city as string (i.e. every schedule has 1 city). Hence you cannot send more than one city to this table as it only needs one char field!

Perhaps you should consider using a ManyToManyField instead of a CharField and save the cities in your database.

Otherwise you need to make sure the CharField can store a list. You can handle this manually, or use a JsonField or an ArrayField (if you are using Postgres).

Basically the problem I am trying to highlight is that you have a CharField to store 1 city, but you want to store multiple cities!

answered Jun 19 '22 at 11:52

Sorin Burghiu

715
1
7
26

a ManyToManyField related to what? can you elaborate on that? – Sam Jun 19 '22 at 12:01
The `ManyToManyField` approach would only work if you want (or if it is acceptable) to also save the cities (so have a `City` model). It may not be useful in your case, that's why I gave the other recommendations, but feel free to go for a `ManyToManyField` if you think that's a good solution for your implementation. – Sorin Burghiu Jun 19 '22 at 12:03
I use sqlite unfortunately. Is there any other way to save multiple values in a field? – Sam Jun 19 '22 at 12:05
`JsonField` is probably your best go. However you are always free to try having a `Charfield` like you currently are and treat it as a list. You will need a lot of validation, hense why `JsonField` would likely give you an easier time. – Sorin Burghiu Jun 19 '22 at 12:09

django multi select field saves only one value

1 Answers1