AngularJS按钮提交不起作用

问题描述：

我想从AngularJS调用Spring Restful服务POST方法。AngularJS按钮提交不起作用

下面是我的JSP。

<%@ page language="java" contentType="text/html; charset=ISO-8859-1" 
    pageEncoding="ISO-8859-1"%> 
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> 
<html> 
<head> 
<script 
    src="https://ajax.googleapis.com/ajax/libs/angularjs/1.4.4/angular.js"></script> 

<script type="text/javascript"> 
var app = angular.module("UserManagement", []); 
app.controller("UserManagementController", function($scope, $http) { 

       //Initialize page with default data which is blank in this example 
       $scope.policy = []; 
       $scope.form = { 
        id : -1, 
        firstName : "", 
        lastName : "", 
        email : "" 
       }; 

       //HTTP DELETE- delete employee by Id 
       $scope.submitEmployee = function(policy) { 
        $http({ 
         method : 'POST', 
         url : '/Add_Policy', 
         data : angular.toJson($scope.form), 
         headers : { 
          'Content-Type' : 'application/json' 
         } 
        }).then(_success, _error); 
       }; 


      }); 
</script> 
<meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1"> 
<title>MMS Ensure</title> 
</head> 
<body ng-app="UserManagement" 
    ng-controller="UserManagementController"> 
    <h1>New Policy</h1> 
    <!-- https://dzone.com/articles/building-rest-service-collects --> 
    <!-- http://howtodoinjava.com/angularjs/angularjs-http-restful-api-example/ --> 
    <from ng-submit="submitEmployee()"> 
    <table> 
     Policy #: 
     <input type="text" ng-model="Policy"> 
     <br> Policy Type: 
     <input type="text" ng-model="Type"> 
     <br> Policy Tenture 
     <input type="text" ng-model="Tenture"> 
     <br> Start Date: 
     <input type="text" ng-model="SDate"> 
     <br> Holder Name: 
     <input type="text" ng-model="HName"> 
     <br> Age: 
     <input type="text" name="Age"> 
     <br> 
     <input type="submit"> 
    </table> 
    </from> 

</body> 
</html>

如果我按提交按钮，它不会调用我的服务。请帮助

更多信息：我正在本地运行此项目，并且在同一个项目中也有Spring服务。我试图在浏览器控制台中访问$ scope，它抛出错误，说它未定义。

你的表格标签中有一个错字，它应该不是从 – d4vsanchez

的表格谢谢:)知道了!! – Geek

答

你让错字，其form元素不from

<from ng-submit="submitEmployee()">

应该

<form ng-submit="submitEmployee()">

另一件事是技术上table不能有其他的元素里面直接想到tbody，tr，tfoot，thead ，td等（它们可以位于td/th ）。您所拥有的当前HTML是错误的&无效。

如果您检查元素，您会发现table里面的html必须抛出table元素。

我看不到任何理由您需要table元素在这里。您可以简单地删除table元素包装。

答

有错字，它应该是

<form ng-submit="submitEmployee()"> 
<table> 
    <thead> 
     <tr> 
      <td> 
      </td> 
     </tr> 
    </thead> 
    <tbody> 
     <tr> 
      <td> 
      </td> 
     </tr> 
    </tbody> 
    <tfoot> 
     <tr> 
      <td> 
      </td> 
     </tr> 
    </tfoot> 
</table>

，它的良好的初步实践，让您的控制器和HTML在单独的文件。

我没有看到此答案提供了哪些新信息。 –

AngularJS按钮提交不起作用

相关推荐