Focus on newly created DNS server field
Got feedback from IBM's design team that to help usability after adding
a DNS Server field, focus on the newly created DNS server field.
Decided to go with a directive instead of putting this in a controller
after reading:
https://stackoverflow.com/questions/22292832/angular-ng-init-pass-element-to-scope,
https://github.com/angular/angular.js/issues/9031,
https://groups.google.com/forum/#!topic/angular/6uxWl8Z0DPw
Having dom manipulation code in the controller is frowned upon.
Tested: Verified the field is in focus (i.e. the cursor is in the
textbox).
Change-Id: Ia548361e7ac47363e05ea2963807bca0c5bf51e2
Signed-off-by: Gunnar Mills <gmills@us.ibm.com>
diff --git a/app/configuration/controllers/network-controller.html b/app/configuration/controllers/network-controller.html
index f6d0a5d..7a24671 100644
--- a/app/configuration/controllers/network-controller.html
+++ b/app/configuration/controllers/network-controller.html
@@ -77,10 +77,10 @@
<div class="column small-12 large-4">
<!-- Call Nameservers "DNS Servers" on the GUI -->
<fieldset class="net-config__static-ip-wrap" ng-repeat="dns in interface.Nameservers track by $index">
- <label for="net-config__prime-dns">DNS Server {{$index+1}}</label>
- <input id="net-config__prime-dns" type="text" ng-model="dns" ng-blur="interface.Nameservers[$index] = dns"/>
+ <label for="net-config__prime-dns{{$index+1}}">DNS Server {{$index+1}}</label>
+ <input id="net-config__prime-dns{{$index+1}}" type="text" ng-model="dns" ng-blur="interface.Nameservers[$index] = dns" set-focus-dns-field/>
</fieldset>
- <button type="button" class="btn-primary inline" ng-click="interface.Nameservers.push('');">Add new DNS server</button>
+ <button type="button" class="btn-primary inline" ng-click="addDNSField()">Add new DNS server</button>
</div>
</fieldset>
<div class="network-config__submit-wrapper">