validate ui-select Angular JS - outside form



我需要在按钮单击事件上验证ui-select。当在ui-select中选择值时,只需要启用按钮。但问题是,按钮在不同的div控件之外,不使用表单标签(已经在div内使用另一个表单用于另一个动作)。我的示例代码如下:

<div class="form-group form-group-sm">
    <label class="control-label text-xs col-xs-12 col-sm-5 col-md-4 ">Search :</label>
    <div class="col-xs-12 col-sm-7 col-md-8 ">
        <ui-select ng-model="cl.selected" theme="bootstrap" on-select="reload($item)" ng-disabled="disabled" title=""
                   required>
            <ui-select-match placeholder="Filter by Client">{{$select.selected.clName}}</ui-select-match>
            <ui-select-choices repeat="cl in cls | clFilter: {clName: $select.search, clNum: $select.search}">
                <div ng-bind-html="cl.clName | highlight: $select.search"></div>
                <small>
                    Cl Num : {{cl.clNum}}
                </small>
            </ui-select-choices>
        </ui-select>
    </div>
</div>

和按钮如下:

<ul class="list-inline pull-right">
    <li>
        <button id="clientSaveContinue" class="btn btn-primary  btn-sm next-step"
                ng-click="submitForm()">
            Save and Continue
        </button>
    </li>
</ul> 

那么,如何启用按钮点击任何ui-select值包含或使ui-select为必需

Not so much info =(

)

建议在表单标签中使用submitForm(),而不是在按钮点击事件中使用

<form ng-submit="submitForm()"></form>

如果你不能在表单中使用按钮,你可以在表单中创建<input type="submit"><button type="submit">(如果不存在),并使用某种链接指令。

'use strict';
import angular from 'angular';
function linked() {
    return (scope, element, attrs) => {
        var id = attrs['linked'];
        element.on('click', function () {
            document.getElementById(id).click();
            return false;
        });
    }
}
export default angular.module('components', [])
    .directive('linked', linked)
    .name;

并使用它:

<form ng-submit="submitForm()">
    ...
    <input type="submit" style="display: none" id="mySubmitId">
</form> 
<button type="button" linked="mySubmitId">

再看ng-submit指令

相关内容

  • 没有找到相关文章

最新更新