javascript - Dynamic Table using Angularjs -
i new angularjs. tried create dynamic table table not generated , noticed form submit not working. please have , advise me.
<script> var app =angular.module("myapp",[]); app.controller("myctrl",function($scope) { $scope.students = [{ 'name' : 'ab', 'email' : 'ab@gmail.com', 'dept' : 'cse' }]; $scope.addstudent = function(){ console.log('addstudent'); $scope.students.push( { 'name' : $scope.name, 'email' : $scope.email, 'dept' : $scope.dept }); $scope.name = ''; $scope.email = ''; $scope.dept = ''; }; }); </script>
here respective html.
<body> <div ng-app = "myapp" controller="myctrl"> <div class = "form-group" > <form class = "student-form" ng-submit="addstudent()"> <div class = "row"> <label class = "col-md-6" for= "name"> name :</label> <input class = "col-md-6" type ="text" ng-model="name" class="validate" required> </div> <div class = "row"> <label class = "col-md-6" for= "email"> email :</label> <input class = "col-md-6" type ="email" ng-model="email" class="validate" required> </div> <div class = "row" > <label for= "dept" class = "col-md-6"> department :</label> <input class = "col-md-6" type ="text" ng-model="dept" class="validate" required> </div> <div class = "row"> <!-- <button type="button" class="btn btn-success col-sm-6" ng-click= addstudent()>add</button> <button type="button" class="btn btn-danger col-sm-6" ng-click = reset()>reset</button> --> <input type="submit" value="submit" class="btn btn-success"/> </div> {{name + ' ' + email +' ' + dept }} </form> </div> <div class = "table-responsive"> <table class="table"> <thead > <tr class="success"> <td> name </td> <td> email</td> <td> department </td> </tr> </thead> <tbody> <tr ng-repeat="x in students"> <td>{{ x.name }}</td> <td>{{ x.email }}</td> <td>{{ x.dept }}</td> </tr> <tbody> </table> </div> </div> </body>
you've got typo.
use ng-controller
instead of controller
, work.
Comments
Post a Comment