Html select element option disabled microsoft edge [duplicate]

Question

So i have the following element:

<div class="input-field col s12">
   <select [(ngModel)]="view.frequency" >
      <option value="" disabled selected>Vælg hyppighed</option>
      <option [value]="1">Aldrig</option>
      <option [value]="2">Sjældent</option>
      <option [value]="3">En gang imellem</option>
      <option [value]="4">Ofte</option>
      <option [value]="5">Altid</option>
   </select>
   <label>Vælg hyppighed</label>
</div>

Now on chrome this produces the following result:

however on edge it seems to ignore the disabled option and sets the default to the first value Aldrig:

Can anyone tell me whats going on here?

Sounds like a problem with Angular, since the same code without the ngModel stuff works in Edge (from @Gambit's answer on default select option as blank) — Heretic Monkey
– Heretic Monkey, Commented Feb 12, 2019 at 21:29

Heretic Monkey · Accepted Answer · 2019-02-12 21:23:51Z

2

Remove selected in option value you used disabled and selected only use disable then you get value 1 option

   <div class="input-field col s12">
      <select [(ngModel)]="view.frequency" >
          <option value="" disabled>Vælg hyppighed</option>
          <option [value]="1">Aldrig</option>
          <option [value]="2">Sjældent</option>
          <option [value]="3">En gang imellem</option>
          <option [value]="4">Ofte</option>
          <option [value]="5">Altid</option>
      </select>
      <label>Vælg hyppighed</label>
  </div>

edited Feb 12, 2019 at 21:23

Heretic Monkey

12.1k7 gold badges62 silver badges133 bronze badges

answered Feb 1, 2019 at 10:39

Raghav

718 bronze badges

Sign up to request clarification or add additional context in comments.

Collectives™ on Stack Overflow

Html select element option disabled microsoft edge [duplicate]

1 Answer 1

Comments

Linked

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Linked

Related