Menu
I have created a single page application (multiple) views using angular that loads different page content. I would like apply initial focus for the first input element for all the screens throughout using angular script rather than using autofocus attribute in each and every page form element.
Is there any way to do this?
and
How do we know whether Angular view (DOM) is completely loaded or not?
371
From MainCtrl you can listen the event when angular view is loaded.
angular.module('app', [])
.controller('Controller', function($scope) {
angular.element(document).ready(function() {
$('form').find('input[type=text],textarea,select').filter(':visible:first').focus();
});
})
.controller('childController', function($scope) {
})<!DOCTYPE html>
<head>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script>
<script src="script.js"></script>
</head>
<body ng-app="app">
<div ng-controller="Controller">
<div>
<div ng-controller="childController">
<form name="myForm" id="myForm">
<label>Field1</label>
<input type="text" ng-model="first" ng-required="true" />
<br>
<label>Field2</label>
<input type="text" ng-model="second" ng-required="is_mobile" />
</form>
</div>
</div>
<br>
</div>
</body>
</html>If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With
