如何手动从按钮触发AngularJS验证表单标签之外吗？ [英] How to manually trigger AngularJS validation from a button outside of the form tags?

问题描述

有鉴于此code：

<div ng-controller="MyCtrl">
    <form ng-submit="onSubmitted()">

    Header inputs:
        <input type="name" ng-model="sample" required/>
        <input type="name" ng-model="sampleX" required/>

        <input type="submit" value="This submit triggers validation. But I wanted to put this button at the end of the page"/>
    </form>

    <hr/>

    Some other form here. Think line items

    <hr />
    <a class="btn" ng-click="/* what could should be put here, so this can trigger the firt form's validation, then submit? */">Wanted this submit button to trigger the validation+submit on the form in which this button doesn't belong</a>


</div>


var app = angular.module('myApp', []);

function MyCtrl($scope) {

    $scope.onSubmitted = function() {
        alert('submitted!');
    };
}

我想最后一个按钮来触发验证（然后提交当事情是有效的）第一个形式。截至目前，只有表单内的按钮可以触发这种形式的验证和提交。是否有形式之外的按钮任何可能的方式做到这一点？

I want the last button to trigger the validation(then submit when things are valid) on first form. As of now, only the button inside the form can trigger that form's validation and submission. Is there any possible way for a button outside the form to do that?

现场试： http://jsfiddle.net/dzjV4/1/

推荐答案

您可以创建指令，然后你就可以连接到＆LT;一类=BTN... 。选中此的jsfiddle

You can create directive which you can then attach to <a class="btn".... Check this jsfiddle

http://jsfiddle.net/dzjV4/2/

请注意，我加入＆LT;输入类型=提交ID ='clickMe'... ，并链接它挂在底部＆LT;一类='BTN'挂=clickMe...

Note that I added to <input type='submit' id='clickMe'... and linked it with link at the bottom <a class='btn' linked="clickMe"...

这篇关于如何手动从按钮触发AngularJS验证表单标签之外吗？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！