角JS HTML5验证 [英] Angular JS HTML5 Validation
问题描述
我有我已经使用了所需标记
我输入的形式 - 这工作得很好,但在我的提交按钮我有 NG-点击=可见=假
隐藏当数据被提交表单。
我怎能让这个只有它设置为false,如果所有的验证是正确的?
App.js
$ scope.newBirthday =功能(){ $ scope.bdays.push({名:$ scope.bdayname,日期:$ scope.bdaydate}); $ scope.bdayname ='';
$ scope.bdaydate =''; };
HTML
<表格名称=birthdayAddNG-秀=看得见的NG-提交=newBirthday()>
<标签>名称:LT; /标签>
<输入类型=文本NG模型=bdayname要求/>
<标签>日期:< /标签>
<输入类型=日期NG模型=bdaydate要求/>
< BR />
<按钮类=BTNNG点击=可见=假类型=提交>保存< /按钮>
< /表及GT;
如果你到形式的FormController将其名称最接近的控制器范围暴露给一个名字。所以你的情况说你有一个结构类似
< DIV NG控制器=myController的>
<! - 或许更多的东西在这里 - >
<表格名称=birthdayAddNG-秀=看得见的NG-提交=newBirthday()>
<标签>名称:LT; /标签>
<输入类型=文本NG模型=bdayname要求/>
<标签>日期:< /标签>
<输入类型=日期NG模型=bdaydate要求/>
< BR />
<按钮类=BTNNG点击=的onSave()类型=提交>保存< /按钮>
< /表及GT;
< / DIV>
现在在你的控制器
函数myController的($范围){
//形式控制器现在为$ scope.birthdayAdd访问 $ scope.onSave =功能(){
如果($ scope.birthdayAdd $有效){
$ scope.visible = FALSE;
}
}
}
如果表单内输入的元素是有效的,则该形态将是有效的。希望这可以帮助。
I have a form that I have used the required tag
on my inputs - this works fine but on my submit button I have ng-click="visible = false"
that hides the form when the data is submitted.
How could I make it so that its only set to false if all the validation is correct?
App.js
$scope.newBirthday = function(){
$scope.bdays.push({name:$scope.bdayname, date:$scope.bdaydate});
$scope.bdayname = '';
$scope.bdaydate = '';
};
HTML:
<form name="birthdayAdd" ng-show="visible" ng-submit="newBirthday()">
<label>Name:</label>
<input type="text" ng-model="bdayname" required/>
<label>Date:</label>
<input type="date" ng-model="bdaydate" required/>
<br/>
<button class="btn" ng-click="visible = false" type="submit">Save</button>
</form>
If you give a name to the form that FormController will be exposed in the nearest controller scope by its name. So in your case say you have a structure something like
<div ng-controller="MyController">
<!-- more stuff here perhaps -->
<form name="birthdayAdd" ng-show="visible" ng-submit="newBirthday()">
<label>Name:</label>
<input type="text" ng-model="bdayname" required/>
<label>Date:</label>
<input type="date" ng-model="bdaydate" required/>
<br/>
<button class="btn" ng-click="onSave()" type="submit">Save</button>
</form>
</div>
Now in your controller
function MyController($scope){
// the form controller is now accessible as $scope.birthdayAdd
$scope.onSave = function(){
if($scope.birthdayAdd.$valid){
$scope.visible = false;
}
}
}
If the input elements inside the form are valid then the form will be valid. Hope this helps.
这篇关于角JS HTML5验证的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!