I'm building an accessible website and trying to manage focus. I need to open a modal and then put focus on the first element in the modal then trap the focus until the modal is closed ("canceled" or "accepted").
HTML
<a href="" ng-click="modalshow = !modalshow; modal.open();">Open Modal</a>
<div ng-show="modalshow" id="modal">
<h3 id="tofs" >Terms of Service</h3>
<p>Lorem Ipsum Lorem Ipsum Lorem Ipsum Lorem Ipsum </p>
<span>Cancel</span>
<span>Accept/span>
</div>
<h2>Seprate Content</h2>
Javascript
angular.module('app')
.controller('Controller', modalCtrl);
function modalCtrl() {
$scope.modal = {
open: function() {
angular.element('#tofs').focus();
}
}
}