Reset the values on Modal box on reload
<p>Reset the values on Modal box on reload</p>

<pre><code>&lt;div class="modal fade" id="detailsModal" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true"&gt;
   &lt;div class="modal-dialog"&gt;
      &lt;div class="modal-content"&gt;
         &lt;!-- Modal Header --&gt;
         &lt;div class="modal-header custom-modal-header"&gt;
            &lt;button type="button" class="close" data-dismiss="modal"&gt;
            &lt;span aria-hidden="true"&gt;&amp;times;&lt;/span&gt;
            &lt;span class="sr-only"&gt;Close&lt;/span&gt;
            &lt;/button&gt;
            &lt;h4 class="modal-title" id="myModalLabel"&gt;
               Create Job Vaccination
            &lt;/h4&gt;
         &lt;/div&gt;
         &lt;!-- Modal Body --&gt;
         &lt;form name="vaccjobctrl.vaccineForm" class="form-inline" &gt;
            &lt;div class="modal-body" style="height: 150px"&gt;
               &lt;div class="row "&gt;
                  &lt;div class="form-group col-md-12"  ng-class="{ 'has-error' : vaccjobctrl.vaccineForm.screeningType.$invalid &amp;&amp; (vaccjobctrl.vaccineForm.screeningType.$dirty || vaccjobctrl.vaccineForm.screeningType.$touched) }"&gt;
                     &lt;label for="regId" class="col-md-6"&gt;Screening Type:&lt;/label&gt;
                     &lt;span class="col-md-6"&gt;
                        &lt;select style="width: 100%;"  
                           ng-model="vaccjobctrl.vaccineForm.screeningTypeMast.screeningTypeId" 
                           ng-options="sctype.screeningTypeId as sctype.screeningType for sctype in vaccjobctrl.screeningTypeList"
                           class="form-control field-size ng-pristine ng-invalid ng-invalid-required ng-valid-maxlength ng-touched" name="screeningType"
                           id="screeningType" required&gt;
                           &lt;option value=""&gt;--SELECT--&lt;/option&gt;
                           &lt;option value="{{sctype.screeningTypeId}}"&gt;{{sctype.screeningType}}&lt;/option&gt;
                        &lt;/select&gt;
                     &lt;/span&gt;
                     &lt;div class="col-sm-6 error-color"
                        ng-if="vaccjobctrl.interacted(vaccjobctrl.vaccineForm.screeningType)"
                        ng-messages="vaccjobctrl.vaccineForm.screeningType.$error"&gt;
                        &lt;div ng-messages-include="src/common/validation-messages.html"&gt;&lt;/div&gt;
                     &lt;/div&gt;
                  &lt;/div&gt;
               &lt;/div&gt;

            &lt;!-- Modal Footer --&gt;
            &lt;div class="modal-footer"&gt;
               &lt;button type="button" class="btn btn-default" data-dismiss="modal"&gt;
               Cancel
               &lt;/button&gt;
               &lt;button type="button" class="btn btn-primary-joli"  ng-click="vaccjobctrl.saveJobVaccination(vaccjobctrl.vacc);" ng-disabled="vaccjobctrl.vaccineForm.$invalid" data-dismiss="modal"&gt;
               Create Vaccination
               &lt;/button&gt;
            &lt;/div&gt;
         &lt;/form&gt;
      &lt;/div&gt;
   &lt;/div&gt;
&lt;/div&gt;
</code></pre>

<p>this is the modal box.</p>

<p>On click on open Modal this function will be called</p>

<pre><code>vm.showModal = function() {
      $('#detailsModal').modal('show');
};
</code></pre>

<p>values in the select box are pre-populated, on reopening the modal box it show the previously selected values. If trying to clear that the the select box border color changed to red on reopen.</p>