使用ng-submit或ng-click提交表单后页面重新加载，更改按钮类型也不起作用

时间：2023-01-23 20:30:54

I have made a form and I need to submit the form but whenever I tried to do the same the page reloads and does nothing! I tried both ng-submit <form> attribute and the ng-click as a <button> attribute! I also tried changing the button type from "submit" to "button" then also I get the same result!

我已经制作了一个表单，我需要提交表单，但每当我尝试做同样的页面重新加载并且什么都不做！我尝试了ng-submit

属性和ng-click作为

Any help would be seriously appreciated!

任何帮助将非常感谢！

Thanks!

谢谢！

1 个解决方案

#1

0  

hope this simple plunker example helps https://plnkr.co/edit/5q9149KSs7qJH0R32NAS?p=preview

希望这个简单的plunker示例有助于https://plnkr.co/edit/5q9149KSs7qJH0R32NAS?p=preview

<!DOCTYPE html>
<html>

  <head>
    <link rel="stylesheet" href="style.css">

    <script src="https://cdnjs.cloudflare.com/ajax/libs/angular.js/1.6.5/angular.js"></script>
    <script src="script.js"></script>
  </head>

<body ng-app="App" ng-controller="Ctrl">

<form ng-submit="myFunc()">
    <input type="text" ng-model="data">
    <input type="submit">
</form>

<p>{{submited}}</p>

<script>
var app = angular.module("App", []);
app.controller("Ctrl", function($scope) {
    $scope.submited = [];
    $scope.myFunc = function () {
        $scope.submited.push($scope.data);
    }
});
</script>
</body>

</html>

#1

0  

hope this simple plunker example helps https://plnkr.co/edit/5q9149KSs7qJH0R32NAS?p=preview

希望这个简单的plunker示例有助于https://plnkr.co/edit/5q9149KSs7qJH0R32NAS?p=preview

<!DOCTYPE html>
<html>

  <head>
    <link rel="stylesheet" href="style.css">

    <script src="https://cdnjs.cloudflare.com/ajax/libs/angular.js/1.6.5/angular.js"></script>
    <script src="script.js"></script>
  </head>

<body ng-app="App" ng-controller="Ctrl">

<form ng-submit="myFunc()">
    <input type="text" ng-model="data">
    <input type="submit">
</form>

<p>{{submited}}</p>

<script>
var app = angular.module("App", []);
app.controller("Ctrl", function($scope) {
    $scope.submited = [];
    $scope.myFunc = function () {
        $scope.submited.push($scope.data);
    }
});
</script>
</body>

</html>
标签：

相关文章