Django предварительно заполняет поле MultieChoice HTML

Каков наилучший способ предварительно заполнить поле выбора с множественным выбором. На мой взгляд, я добавляю контекст значений для поля.

def get_context_data(self, *args, **kwargs):
    context = super(UserProfileUpdateView, self).get_context_data(*args, **kwargs)
    context['mystates']=user.states

выход

Alaska, Arizona, Alabama,

HTML-страница

<div class="form-group">
    <label for="id_states">Add State 2:</label> <select name="states" id="id_states"  multiple="multiple">
    {% include "accounts/snippets/states_drop_down_options.html" %}
    </select>
</div>

state_drop_down_options.htmlm

  <option value="AL">Alabama</option>    
  <option value="AK">Alaska</option>    
  <option value="AZ">Arizona</option>    
  <option value="AR">Arkansas</option>    
  <option value="CA">California</option>

django html selected
person Micah Pearce    schedule 01.05.2018    source источник
comment
stackoverflow.com/q/24403075/4107823   -  person copser    schedule 01.05.2018

Ответы (2)


arrow_upward
1
arrow_downward

В каждой опции вы можете проверить, находится ли эта опция в переменной mystates:

  <option value="AL" {% if 'Alabama' in mystates %}selected{% endif%}>Alabama</option>    
  <option value="AK" {% if 'Alaska' in mystates %}selected{% endif%}>Alaska</option>    
  <option value="AZ" {% if 'Arizona' in mystates %}selected{% endif%}>Arizona</option>    
  <option value="AR" {% if 'Arkansas' in mystates %}selected{% endif%}>Arkansas</option>    
  <option value="CA" {% if 'California' in mystates %}selected{% endif%}>California</option>
person Nazkter    schedule 01.05.2018

arrow_upward
0
arrow_downward

В зависимости от вашего проекта, вы можете использовать его так, как считаете нужным для своей цели.

1-й: Django.forms.ModelMultipleChoiceField или Django.forms.MultipleChoiceField

2nd:Ответ @Nazkter хороший,

3-й:

html
(я добавляю атрибут states к select, содержащему значение {{ states }})

<select name="states" states="{{ states }}" id="id_states"  multiple="multiple">
    {% include "accounts/snippets/states_drop_down_options.html" %}
</select>

javascript

[].forEach.call(document.querySelectorAll('#id_states option')  , function(elm){
    var states = document.querySelector('#id_states').getAttribute("states").replace(/\s/g,'').split(",");
    if(states.indexOf(elm.innerText) > -1){
        elm.selected = true;
    }
});
person Lemayzeur    schedule 01.05.2018