Javascript 提交不起作用_Javascript_Angularjs_Forms

Javascript 提交不起作用

javascript angularjs forms

Javascript 提交不起作用,javascript,angularjs,forms,Javascript,Angularjs,Forms,我正在做一个有角度的js项目。我想通过ng submit提交一份表格。但这不是工作。我的Html代码是 <!DOCTYPE html> <html lang="en"> <head> <title>AngularJS Routes example</title> <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6

我正在做一个有角度的js项目。我想通过ng submit提交一份表格。但这不是工作。我的Html代码是

<!DOCTYPE html>
<html lang="en">
<head>
    <title>AngularJS Routes example</title>
    <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css">
    <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.5/angular.min.js"></script>
    <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.5/angular-route.min.js"></script>
</head>

<body ng-app="sampleApp" class="container">

<div class="btn-group">
    <a href="/view" class="btn btn-info">List</a>
<a href="/add" class="btn btn-danger">Add New</a>
</div>
<hr>

<div ng-view></div>

<script>
    var module = angular.module("sampleApp", ['ngRoute']);

    module.config(['$routeProvider','$locationProvider',
        function($routeProvider,$locationProvider) {
            $routeProvider.
                    when('/view', {
                        templateUrl: 'template/view/list',
                        controller: 'RouteController'
                    }).
                    when('/add', {
                        templateUrl: 'template/view/new',
                        controller: 'RouteController'
                    }).
                    otherwise({
                        redirectTo: '/view'
                    });
                    $locationProvider.html5Mode(true);
        }]);

    module.controller("RouteController", function($http,$scope, $routeParams) {
        $http.get('welcome/phones').success(function(data) {
          $scope.phones = data;
        });

        $scope.formData = {};

        $scope.saveInfo = function() {

            formData = $scope.form;
            console.log(formData);

            $http.post('welcome/save',formData);
        }
    });
</script>



</body>
</html>


AngularJS路由示例

var module=angular.module（“sampleApp”，['ngRoute']）；
module.config（['$routeProvider'，'$locationProvider'，
函数（$routeProvider，$locationProvider）{
$routeProvider。
当（“/view”{
templateUrl:“模板/视图/列表”，
控制器：“路由控制器”
}).
当（“/add”{
templateUrl:“模板/视图/新建”，
控制器：“路由控制器”
}).
否则({
重定向到：'/view'
});
$locationProvider.html5Mode（true）；
}]);
module.controller（“RouteControl”，函数（$http、$scope、$routeParams）{
$http.get（'welcome/phones'）.success（函数（数据）{
$scope.phones=数据；
});
$scope.formData={}；
$scope.saveInfo=函数（）{
formData=$scope.form；
console.log（formData）；
$http.post（'welcome/save'，formData）；
}
});

我的表单模板是

<form action="#" ng-submit="saveInfo()" method="post" ng-controller="RouteController">
    <div class="form-group">
        <label for="">Product</label>
        <input type="text" name="name" ng-model="form.name" class="form-control">
    </div>
    <div class="form-group">
        <label for="">Price</label>
        <input type="text" name="price" ng-model="form.price" class="form-control">
    </div>
    <div class="form-group">
        <input type="submit" class="btn btn-info" value="Submit">
    </div>
</form>


产品
价格

我的

/add

，

/view

工作正常。但当我提交表单时，ng submit不起作用。表格直接提交。我在控制台里没有任何东西。我的问题在哪里？。谢谢。

尝试初始化$scope.form:

$scope.formData = {};
$scope.form = {};

尝试初始化$scope.form：

$scope.formData = {};
$scope.form = {};

根据您提交的代码，您不打算使用

$scope.formData

。我想是你打错了。只需将其更改为

$scope.form={}

$scope.form = {}; // instead of $scope.formData

根据您提交的代码，您不打算使用

$scope.formData

。我想是你打错了。只需将其更改为

$scope.form={}

$scope.form = {}; // instead of $scope.formData

非常感谢。我遇到了问题，当我删除

action=“#”

属性时，一切正常。谢谢。我遇到了问题，当我删除

action=“#”

属性时，一切正常。谢谢。我遇到了问题，当我删除

action=“#”

属性时，一切正常。谢谢。我遇到了问题，当我删除

action=“#”

属性时，一切正常。