hey i am new and already second question for today but i need help when i try puting the ng-submit inside a form its says attribute is not allowed and doesnt work ill be happy if you can help me. and if you can explain to me to when do i need to declare a new controller? andd thats it, thanks alot for those who help
(function() {
var app = angular.module('list', []);
app.controller('peopleListCtrl',['$scope', function($scope){
$scope.persons = plists;
this.addPerson = function() {
if (this.text) {
persons.push(this.person);
this.text='';
}
};
}]);
var plists = [
{ name: 'alon', job: 'web dev', home:'nir tzvi' },
{ name: 'ben', job: 'katbamflighter', home:'nir tzvi' },
{ name: 'shiraz', job: 'dentist assistant', home:'hadera west' }
];
})();
<!DOCTYPE html>
<html ng-app="list">
<head>
<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/angularjs/1.0.6/angular.min.js"></script>
<script type="text/javascript" src="app.js">
</script>
</head>
<body ng-controller="peopleListCtrl">
<br />
<div ng-repeat="people in persons">
<h3>
{{people.name}}
{{people.job}}
{{people.home}}
</h3>
</div>
<br />
<form name="personForm" ng-submit="peopleListCtrl.addPerson()" >
<input type="text" ng-model="person.name"/>
Name:{{person.name}}
<br />
<input type="text" ng-model="person.job"/>
job:{{person.job}}
<br />
<input type="text" ng-model="person.home"/>
home:{{person.home}}
<br />
<input type="submit" value="submit" />
</form>
</body>
</html>
here is the demo
(function() {
var app = angular.module('list', []);
app.controller('peopleListCtrl',['$scope', function($scope){
var plists = [
{ name: 'alon', job: 'web dev', home:'nir tzvi' },
{ name: 'ben', job: 'katbamflighter', home:'nir tzvi' },
{ name: 'shiraz', job: 'dentist assistant', home:'hadera west' }
];
$scope.persons = plists;
$scope.persion = [];
$scope.addPerson = function() {
if ($scope.person) {
$scope.persons.push($scope.person);
$scope.person=null;
}
};
}]);
})();
<!DOCTYPE html>
<html ng-app="list">
<head>
<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/angularjs/1.0.6/angular.min.js"></script>
<script type="text/javascript" src="app.js">
</script>
</head>
<body ng-controller="peopleListCtrl">
<br />
<div ng-repeat="people in persons">
<h3>
{{people.name}}
{{people.job}}
{{people.home}}
</h3>
</div>
<br />
<form name="personForm" ng-submit="addPerson()" >
<input type="text" ng-model="person.name"/>
Name:{{person.name}}
<br />
<input type="text" ng-model="person.job"/>
job:{{person.job}}
<br />
<input type="text" ng-model="person.home"/>
home:{{person.home}}
<br />
<input type="submit" value="submit" />
</form>
</body>
</html>