AngularJS-ng-submit无法在表单中工作
[英]Angularjs - ng-submit not working in form
问题描述
I'm new to AngularJS and I'm trying to submit a simple form using ng-submit but the button not working as well as it's not clickable, It's working on Firefox but the cursor still not changing when it's on the button and not working on Chrome. 
我是AngularJS的新手，正在尝试使用ng-submit提交一个简单的表单，但是该按钮无法正常工作，并且无法单击，它在Firefox上可以正常工作，但是当按钮上的光标无法正常工作时，光标仍然没有变化在Chrome上。
HTML 的HTML
<form novalidate name="newTripForm" ng-submit="vm.addTrip()">
<div class="form-group">
<label for="name">Trip Name</label>
<input type="text" class="form-control" id="name" name="name" ng-model="vm.newTrip.name"/>
</div>
<div class="form-group">
<input type="submit" class="btn btn-sm btn-success" id="submit" value="Add"/>
</div>
</form>
JavaScript 的JavaScript
vm.addTrip = function ()
{
alert(vm.newTrip.name);
};
3 个解决方案
解决方案1
0 2017-11-07 13:18:25
try this: 尝试这个：
<form novalidate name="newTripForm" ng-submit="vm.addTrip()">
<div class="form-group" ng-init="vm.newTrip.name = '';">
<label for="name">Trip Name</label>
<input type="text" class="form-control" id="name" name="name" ng-model="vm.newTrip.name" required/>
</div>
<div class="form-group">
<input type="submit" class="btn btn-sm btn-success" id="submit" value="Add"/>
</div>
解决方案2
0 2017-11-07 14:25:03
Based on and AngularJS docs , you can have two submits on your form. 基于和AngularJS文档 ，您可以在表单上有两个提交。
I created a quick sample based of what is on the docs and your example. 我根据文档和您的示例创建了一个快速示例。
(function() { var app = angular.module("test", []); var TestController = function() { var vm = this; vm.newTrip = { name: "" }; vm.addTrip = function() { // Some code console.log("Added " + vm.newTrip.name + " to database!"); vm.newTrip.name = ""; } } app.controller("TestController", [TestController]); })();
<html> <head> <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script> </head> <body ng-app="test"> <div ng-controller="TestController as vm"> <form novalidate name="newTripForm" ng-submit="vm.addTrip()"> <div class="form-group"> <label for="name">Trip Name</label> <input type="text" class="form-control" id="name" name="name" ng-model="vm.newTrip.name" /> </div> <div class="form-group"> <input type="submit" class="btn btn-sm btn-success" id="submit" value="Add" /> </div> </form> </div> </body> </html>
解决方案3
0 2017-11-08 08:05:23
try this remove the form 试试这个删除表格
<div class="form-group">
<label for="name">Trip Name</label>
<input type="text" class="form-control" id="name" name="name" ng-model="vm.newTrip.name"/>
</div>
<div class="form-group">
<button ng-click="addTrip()"></button>
</div>
声明:本站的技术帖子网页，遵循CC BY-SA 4.0协议，如果您需要转载，请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.