Question

我需要验证按钮点击事件的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

Answer 1

没有那么多信息=（

建议在表单标记内使用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指令。

验证ui-select Angular JS - 外部表单

1 个答案: