HTML5必填字段和angularjs提交 [英] HTML5 required field and submit with angularjs

问题描述

如何在JavaScript在提交之前检查表单的必填字段？

How to check the required fields of a form before submitting it in javascript ?

我与Angularjs工作，你可能知道，我从来没有重新加载页面。
我创建输入文本是这样的：

I'm working with Angularjs and as you probably know, I never reload the page. I have created input text like this :

<input type="text" name="truck" ng-model="my model" typeahead="my typeahead" typeahead-min-length="1" required/>

下面是我在表格最后提交按钮：

Here is my submit button at the end of the form :

<button type="submit" ng-click="saveDelivery(newDelivery)" class="btn btn-primary">Create the delivery</button>

但是，当我提出，我进入saveDelivery第一，然后我从谷歌Chrome的消息：请填写在这个领域。

But when I submit, I go into "saveDelivery" first, and then I have the message from Google chrome : "Please fill in this field..."

我怎样才能做到在提交前检查输入？

How can I do to check the input before submitting ?

推荐答案

窥视纳克-submit 指令。

这基本上是看在你定义的形式为你的标记定义的任何验证（需要类型）。所有你需要做的就是把你的点击动作，并将其放置在了NG-指令提交表单的顶端。

This essentially looks in your defined form for any validation defined in your markup (required, type). All you have to do is take your click action and place it at the top of your form in the ng-submit directive.

<form ng-submit="saveDelivery(newDelivery)">
    <input type="text" name="truck" ng-model="my model" typeahead="my typeahead" typeahead-min-length="1" required/>
    <button type="submit" class="btn btn-primary">Create the delivery</button>
</form>

由于您的按钮定义为类型'提交'，这将提交表单，preforming适合你的'NG-点击动作。角将从根本上劫持提交，并提交给saveDelivery之前验证表单。所有你需要做的就是确定你想要的验证，无论是必要的输入，或者你在你的输入做TYPE =电子邮件，它将使用HTML 5的电子邮件验证，并确保它是一个电子邮件地址。

Because your button is defined as type 'submit', this will submit the form, preforming the 'ng-click' action for you. Angular will essentially hijack the submit, and validate your form before submitting it to 'saveDelivery'. All you have to do is define what you want validated, whether it is 'required' input, or it you do type="email" on your input, it will use HTML 5 email validation and make sure it is an email address.

角使它非常容易验证添加到任何形式。一旦验证通过，角便会触发saveDelivery方法！

Angular made it VERY easy to add validation to any form. Once validation is passed, Angular will then trigger your saveDelivery method!

这篇关于HTML5必填字段和angularjs提交的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！