S
S
Salavat Sharapov2015-04-08 11:15:58
JavaScript
Salavat Sharapov, 2015-04-08 11:15:58

How to reinitialize selects?

Good afternoon!
I am using the form:

<form id="Form" action="" method="POST">
            {% csrf_token %}
            <input type="hidden" name="data-id" value="{{ id }}">
            <div>
                <label for="id_title">Название структуры:</label>
                <div>
                    <input id="id_name" name="name" type="text" value="{{ form_model.name.value }}" required />
                </div>
            </div>
            {#     Inline         #}
            <div>Органы управления</div>
            {{ form_inline.management_form }}
            {{ form_inline.non_form_errors }}
            {% for form in form_inline.forms %}
                <div class="inline-management {{ form_inline.prefix }}">
                    <div>
                        <div>
                            <label for="id_structure-{{ forloop.counter0 }}-name">Название органа управления:</label>
                            <input id="id_structure-{{ forloop.counter0 }}-name" maxlength="255"
                                   name="structure-{{ forloop.counter0 }}-name" type="text"
                                   {% if form.name.value %}value="{{ form.name.value }}"{% else %}placeholder="Введите название ..."{% endif %} />
                        </div>
                        <div>
                            <label for="id_structure-{{ forloop.counter0 }}-header">Руководитель:</label>
                            <select id="id_structure-{{ forloop.counter0 }}-header"
                                    name="structure-{{ forloop.counter0 }}-header">
                                <option value="">Выберите руководителя ...</option>
                                {% for id, name in form.fields.header.choices %}
                                    <option value="{{ id }}" {% if id == form.header.value %} selected="selected" {% endif %}>{{ name }}                                                                                                      </option>
                            {% endfor %}
                            </select>
                        </div>
                        <div>
                            <label for="id_structure-{{ forloop.counter0 }}-managers">Состав:</label>
                            <select class="form-control input-sm select-managers" id="id_structure-{{ forloop.counter0 }}-managers"
                                    name="structure-{{ forloop.counter0 }}-managers"multiple="multiple">
                                {% for id, name in form.fields.managers.choices %}
                                    <option value="{{ id }}"
                                            {% for item in form.managers.value %}
                                                {% if id == item %} selected="selected"
                                                {% endif %}{% endfor %}>
                                        {{ name }}
                                    </option>
                                {% endfor %}
                            </select>
                        </div>
                    </div>
                </div>
                <script>
                    $('#id_structure-{{ forloop.counter0 }}-header').selectize();
                    $("#id_structure-{{ forloop.counter0 }}-managers").multiselect({
                        enableFiltering: true,
                        enableClickableOptGroups: true,
                        nSelectedText: ' - выбрано',
                        maxHeight: 400,
                        buttonWidth: '100%'
                    });
                </script>
            {% endfor %}
            <button type="submit" >Сохранить</button>

        </form>
<script>
$('.inline-management.{{ form_inline.prefix }}').formset({
            prefix: '{{ form_inline.prefix }}',
            addText: 'Добавить',
            added: 
                      $(function(row, formCount){
                         $('#id_structure-'+formCount+'-header').selectize();
                        $('#id_structure-'+formCount+'-managers').multiselect({
                            enableFiltering: true,
                            enableClickableOptGroups: true,
                            nonSelectedText: 'Ничего не выбрано',
                            nSelectedText: ' - выбрано',
                            maxHeight: 400,
                            buttonWidth: '100%'
                        });
                       }) 
        });
</script>


Selectize.js, multiselect.js and also jquery.formset.js are connected in it, with the help of which additional forms are added, and after adding (added), a function is triggered that to the elements (#id_structure-'+formCount+'-header') and ( ('#id_structure-'+formCount+'-managers') applies the above "selects" The problem is that after adding a new inline form("selects" are not tied up (when I click on a new select it throws me back to the one above)).
I lathered my eyes..
About the script in the loop:
Needed for those forms that come filled in. (If you don't do it - "kick")

Answer the question

In order to leave comments, you need to log in

Didn't find what you were looking for?

Ask your question

Ask a Question

731 491 924 answers to any question