angularjs ng-submit not working

Question

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>

Upalr · Accepted Answer · 2015-11-17 18:07:22Z

2

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>

edited Nov 17, 2015 at 18:07

answered Nov 17, 2015 at 17:44

Upalr

2,1462 gold badges25 silver badges33 bronze badges

Sign up to request clarification or add additional context in comments.

3 Comments

alon.a Over a year ago

didnt solve still nothing happens on submit and when mouse over ng-submit it says attribute is not allowed here

alon.a Over a year ago

working!! =D but why i need to define if $scope.person?? i want it to submit only if there is text

Upalr Over a year ago

because you are using person.name as ng-model without defining $scope.person. you need to define $scope.person first..

Collectives™ on Stack Overflow

angularjs ng-submit not working

1 Answer 1

3 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

3 Comments

Your Answer

Sign up or log in

Post as a guest

Related