RGdent RGdent - 4 months ago 9
AngularJS Question

angularjs ng-focus multiple fields

I want to highlight input fields when selected using ng-focus. I have looked at some examples but can't find one that works for me.

The issue is when I select one input field not only does that input get highlighted but both of them gets highlighted.

How can I accomplish this with individual results?

<label class="item item-input item-dark">
<span class="input-label">Make</span>
<input type="text" ng-model="M1" ng-required ng-style="style" ng-focus="style={'background-color':'#387ef5'}" ng-blur="style={}">
</label>
<label class="item item-input item-dark" >
<span class="input-label">Model</span>
<input type="text" ng-model="M2" ng-required ng-style="style" ng-focus="style={'background-color':'#387ef5'}" ng-blur="style={}">
</label>

Answer

See this fiddle :

http://jsfiddle.net/2o0mym3y/1/

It contains your style which actually updates a variable & hence both of them get the same value.

& the right way. to just use a focus (a pseudo-selector)& a normal style.

.stylea:focus {
  background-color:#387ef5;
}
Comments