Angular form doesn't submit

Question

I have this angular script

var app = angular.module('j_app', ['ngMaterial'], function($interpolateProvider)    {
    $interpolateProvider.startSymbol('<%');
    $interpolateProvider.endSymbol('%>');
});

app.controller('j_controller', function($scope, $http) {
  $scope.formdata = {};

  $scope.formsubmit = function(){
    $http({
       method : 'POST',
       url : '/dodong',
       data : $.param($scope.formdata),
       headers : {'Content-Type' : 'application/x-www-form-urlencoded'}
    }).success(function(data){
       console.log(data); 
    });
  };
});

and this angular form

<body ng-app="j_app">
<div ng-controller="j_controller">
<form ng-submit="formsubmit()">
    <fieldset>
        <input type="text" name="username" ng-model="formdata.username" placeholder="Your username here..." />
        <input type="password" name="password" ng-model="formdata.password" placeholder="Your password here..." />
    </fieldset>
    <button>Submit test angular</button>
</form>
</div>
</body>

but the form did not submit like nothing happen yet no errors thrown. Any ideas?

Have you tried <button ng-click="formsubmit()">Submit test angular</button> ? — Ellone
– Ellone, Commented Aug 3, 2015 at 14:39

Roy Dictus · Accepted Answer · 2015-08-03 15:06:26Z

If you type this in Plunker, it will work:

<!doctype html>
<html lang="en">

<head>
  <meta charset="UTF-8">
  <script src="//ajax.googleapis.com/ajax/libs/angularjs/1.4.3/angular.min.js"></script>
</head>

<body ng-app="submitTest">
  <script>
    angular.module('submitTest', [])
      .controller('j_controller', ['$scope', function($scope) {
        $scope.text = 'type something, will ya';
        $scope.formsubmit = function() {
          alert("Called");
        };
      }]);
  </script>
  <div ng-controller="j_controller">
    <form ng-submit="formsubmit()">
      <fieldset>
        <input type="text" ng-model="text" name="text" />
      </fieldset>
      <input type="submit" id="submit" value="Submit" /> </form>
  </div>
</body>

</html>

You need to use <input type="submit">.

Copy/paste my code above in Plunker and modify and test your changes as you go.

IrishGringo · Accepted Answer · 2018-09-23 12:53:30Z

0

I'm guessing that this thread should be removed as ngModel has been depricated in V6 of Angular. Will be completely removed in V7

answered Sep 23, 2018 at 12:53

IrishGringo

4,0628 gold badges41 silver badges51 bronze badges

Collectives™ on Stack Overflow

Angular form doesn't submit

2 Answers 2

2 Comments

Comments

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

2 Comments

Comments

Related