Please, help to create page with two buttons (ADD and SHOW).
Pressing the first button to show the shape of the three inputs (Name, Last Name, e-mail) and button Save.
When you click on Save it should save the data form inputs to the array and clear all inputs. Must also be a check on the validity of the form (all fields are required and check for correct e-mail).
Clicking on the SHOW to appear items that were stored in a form, but only the name, but even when you click on a particular element should jump out pop-up detailed (should include all data from the form (Name, Last Name, e-mail)).
And pagination should be implemented (to the page being displayed item is more than 10).
Sorry for bad english!
<!-- main buttons -->
<div class="container text-center" ng-app="myApp" ng-controller="Ctrl">
<button class="btn btn-default" ng-click="myFuncAdd()">ADD</button>
<button class="btn btn-default" ng-click="myFuncInfo()">SHOW</button>
<div ng-show="showMeAdd" ng-app="myInputs">
<p>
<p>
<input class="form-control" type="text" placeholder="Firstname" >
</p>
<p>
<input class="form-control" type="text" placeholder="Secondname" >
</p>
<p>
<input class="form-control" type="email" placeholder="Email" >
</p>
<button class="btn btn-default" ng-click="myFuncAddInfo()">Save</button>
</p>
</div>
<div ng-show="showMeInfo">
<div></div>
<div></div>
<div></div>
</div>
</div>
<!-- end main buttons -->
<script>
var myApp = angular.module("myApp", []);
myApp.controller("Ctrl", function($scope) {
$scope.showMeAdd = false;
$scope.showMeInfo = false;
$scope.myFuncAdd = function() {
$scope.showMeAdd = !$scope.showMeAdd;
}
$scope.myFuncInfo = function() {
$scope.showMeInfo = !$scope.showMeInfo;
}
});
</script>
Aucun commentaire:
Enregistrer un commentaire