Trialcoder Trialcoder - 1 month ago 6
HTML Question

On option select angularJS not working

Scenario - Following is my

HTML
code for select box which on selecting
Every Day
option suppose to open a div with
Everyday
selected and select day select option starting from 2.

Problem - Though the div is opening correctly but Every Day option is not
pre selected
and day select drop down is also not starting from 2 like I believe it should.

Let me know what I am doing wrong here.

HTML Code -

<div>
<select
id="repeatval"
ng-model="event.repeat"
ng-options="repeat.value as repeat.name for repeat in repeats"
ng-init="event.repeat = event.repeat || repeats[0].value"
class="btn">
</select>
</div>
<div ng-if="event.repeat === 2">
<input type="radio" name="everyday" ng-model="event.everyday" value="forever" ng-checked="true" /> Everyday
<input type="radio" name="everyday" ng-model="event.everyday" value="dayselval" />
Select <select
id="selday"
ng-model="event.selday"
ng-options="day.value as day.name for day in days"
ng-init="event.day = event.day || days[0].value"
class="btn">
</select> Day
<input type="radio" name="everyday" ng-model="event.everyday" value="pickdate" /> Pick a date
</div>


Plnkr - PLNKR DEMO

EDIT -

Ad per Vamsi comment- I solved the selection problem by applying -

ng-init="event.selday = event.day || days[0].value"


Changed
event.day
to
event.selday

Answer

If you want make input radio pre selected you can set ng-value="forever"

For selecting the option you must set the ng-model value, in your case the value is not selected and you can do this with ng-init like this:

 Select <select
                id="selday"
                ng-init="event.selday = 2"
                ng-model="event.selday"
                ng-options="day.value as day.name for day in days"
                ng-init="event.day = event.day || days[0].value"
                class="btn">
               </select> Day