Abundance Abundance
Login Or Sign up

initialize empty value or disable it in select2 in angularjs on page load

81 Views Asked by At

So, i'm dealing with angularjs 1 and select2-ui. I have this div.

<div>
  <label class="control-label" translate>Abundance</label>
  <select ui-select2 ng-model="thisid" class="input-xxlarge">
  <option ng-repeat="selection in data" value="{{selection.id}}">
    {{selection.ime}}
  </option>
</select>
</div>

The problem is, that I have another div, with a "ng-if" inside it that is watching if the select above it was selected. The problem is that on page load, the select above loads the data right away thus triggering also my watch functions in my controller. So trying to solve it with a ng-change is also a no go, because then the hidden divs unhide when the page is reloaded instead of the user activating it.

So my question is basically, how to prevent the select2 form from loading the data right away and just having nothing selected at the start, for example this works great, unless when I have to use a ng-repeat.

<div>
  <label class="control-label" translate>Herbarium sample?</label>
  <select>
    <option value="" selected disabled>Please select</option>
    <option value="">yes</option>
    <option value="">no</option>
  </select>
</div>

This above works, the value is not selected. Would it work if I somehow pushed a null value on top of the scope being looped trough?

0

There are 0 best solutions below