javascript - AngularJS 按钮提交不起作用

标签 javascript angularjs spring jsp

我正在尝试从 AngularJS 调用 Spring Restful 服务 POST 方法。

下面是我的 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,它抛出错误,指出其未定义。

最佳答案

您输入错误,其 form 元素不是 from

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

应该是

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

从技术上讲,table 不能直接在其中包含其他元素,需要 tbodytrtfoottheadtd 等(它们可以位于 td/th 内)。您当前的 HTML 是错误且无效的。

如果你检查元素,你会发现table内部的html必须被扔到table元素之外。

我认为您没有任何理由需要这里的 table 元素。您只需删除 table 元素包装即可。

关于javascript - AngularJS 按钮提交不起作用,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/38933541/

相关文章:

javascript - 使用 JS 更改特定类的链接 css 颜色

javascript - OpenLayers 6 - ES6 项目结构

javascript - 使用 AngularJs 进行缓存

spring - 防止hsqldb在初始化数据库时因错误而停止

java - 如果一个@Transactional 注释方法在同一个对象实例上调用另一个@Transactional 注释方法会发生什么?

Spring DI applicationContext.xml xsi :schemaLocation used?到底是怎么回事

javascript - 为什么 log4js 创建一个空文件但从不将消息放入其中?

javascript - 如果参数不存在则推送到对象

angularjs - 在 Angular 表达式中解码 HTML

angularjs - 带有 Windows 身份验证的 WebAPI CORS - 允许匿名 OPTIONS 请求