Форма внутри Boostrap Modal не сбрасывается

Я использую событие click ниже для сброса формы.

'click .resetBulkAssignForm' : function(events, template){
    console.log('Reset', $(".bulkAssignForm")[0]);
    $(".bulkAssignForm")[0].reset();
    $(".bulkAssignForm").find("select").val("");
    $('#firmName').select2('data', null);
},

Я также попробовал большинство ответов, доступных на SO, чтобы решить эту проблему.

Вопрос: Как сбросить форму внутри Bootstrap Modal?

Ниже приведено изображение модального окна с выводом на консоль.

введите здесь описание изображения

ПРИМЕЧАНИЕ. Я использую AdminLTE 2.3.11, Select2. Также обратите внимание, что я уже пробовал решения в ссылках SO, таких как как очистить все поля ввода-в-бутстрапе-модальный-при-нажатии-данные-закрыть-приклад, how-to-reset-form-body-in-bootstrap-modal-box

Добавление HTML-кода на случай, если вам нужно увидеть.

<div id="myBulkModal" class="modal fade modal-primary" role="dialog">
    <div class="modal-dialog modal-lg">
      <div class="modal-content">
        <div class="modal-header">
          <button type="button" class="close" data-dismiss="modal">&times;</button>
          <h2 class="modal-title">Bulk Assignment</h2>
        </div>
        <div class="modal-body">
           <section class="content">
             <form class="bulkAssignForm">
               <fieldset>
                 <div class="row">
                    <input type="hidden" id="taskIdInput" value="{{getTaskId}}" />
                 </div>
                 <div class="row">
                   <div class="input-group col-sm-12">
                     <label for="firmName">Firms</label><br />
                     <select id="firmName" multiple class="form-control input-lg" required>
                       {{#each firmNamesFromAssignment}}
                          <option value="{{value}}">{{label}}</option>
                       {{/each}}
                     </select>
                   </div>
                 </div>
                 <br />
                 <div class="row">
                   <div class="input-group col-sm-12">
                     <label for="assignee">Assignee</label><br />
                     <select id="assignee" class="form-control input-lg" required>
                       <option  selected="selected" value="">Select Option</option>
                       {{#each usersSelect2}}
                          <option value="{{value}}">{{label}}</option>
                       {{/each}}
                     </select>
                   </div>
                 </div>
                 <br />
                 <div class="row">
                   <div class="input-group col-sm-12">
                     <label for="reviewedBy">Reviewer</label><br />
                     <select id="reviewedBy" class="form-control input-lg" required>
                       <option  selected="selected" value="">Select Option</option>
                       {{#each usersSelect2}}
                          <option value="{{value}}">{{label}}</option>
                       {{/each}}
                     </select>
                   </div>
                 </div>
                 <br />
                 <div class="row">
                   <!-- buttons -->
                   <button type="submit" class="btn btn-outline">
                     <span class="glyphicon glyphicon-ok"></span> Assign
                   </button>
                   &nbsp;&nbsp;
                   <button type="button" class="btn btn-outline resetBulkAssignForm">
                     <span class="glyphicon glyphicon-off"></span> Reset
                   </button>
                   &nbsp;&nbsp;
                   <button type="button" class="btn btn-outline" data-dismiss="modal">
                     <span class="glyphicon glyphicon-refresh"></span> Close
                   </button>

                 </div>
               </fieldset>
             </form>
           </section>
        </div>
      </div>
    </div>
  </div>

person Ankur Soni    schedule 27.09.2017    source источник
comment
Все ваши выборы Select2, верно?   -  person Styx    schedule 27.09.2017
comment
Да, ты прав.   -  person Ankur Soni    schedule 27.09.2017
comment
Просто чтобы быть уверенным, какая именно версия Select2 используется?   -  person Styx    schedule 27.09.2017
comment
уже: [email protected]   -  person Ankur Soni    schedule 27.09.2017


Ответы (1)


После изменения значения базового <select> или <input> Select2 вы должны инициировать событие change, чтобы это изменение было обработано кодом Select2 и отображено соответствующим образом:

$(".bulkAssignForm").find("select").val("").trigger("change");

Успешно протестировано на AutoForm Demo тестовой странице.

person Styx    schedule 27.09.2017
comment
Вы можете помочь с этим? stackoverflow.com/questions/46469831/ относится к одному и тому же вопросу, но к другой проблеме. - person Ankur Soni; 28.09.2017