Angularjs表格脏而不适用于Dropdown

时间:2017-08-24 04:01:04

标签: angularjs angular-ui-bootstrap

我有一个简单的引导程序表单。为了举例,我有一个输入字段和一个下拉列表。我想只在进行更改时启用保存按钮。为了做到这一点,我只在表单脏了时启用了保存按钮。

问题是 - 当我更改它的输入字段时,按钮被启用,当我更改下拉列表时,基本上选择列表项,表单不会将其识别为脏,因此它仍然是禁用。

有什么想法吗? 我还尝试创建一个隐藏的输入字段,每当选择值更新时它都会更新 - 但它仍然无法正常工作。

我的示例表单(请忽略任何拼写错误,因为我删除了大部分代码。功能正常工作。只是禁用按钮不起作用)

<form name="customizeForm" id="customize-form" class="bm-form" data-ng-cloak novalidate data-ng-submit="ctrl.saveCustomization(customizeForm.$valid)">
    <!--if i change this input,  it works -->
    <input id="answer" type="text" name="answer" data-ng-model="ctrl.answer">

    <!--If i change the below dropdown, it doesnt work and the button is still disabled -->
    <div class="form-group dropdown col-xs-12 col-md-6" data-uib-dropdown data-keyboard-nav data-is-open="status[$index].isopen" data-ng-init="status[$index].newSelectedValue = ''">
        <button id="profile-menu" type="button" class="form-control select-control dropdown-togglebtn" data-uib-dropdown-toggle>
              <span class="selected" data-ng-bind-html="status[$index].newSelectedValue</span>
                 <span class="icon icon-down-arrow" aria-hidden="true"></span>
              </button>
        <ul class="dropdown-menu" role="menu" data-aria-labelledby="menu">
            <li data-ng-repeat="answer in question.Answers">
                <a href="" data-ng-click="status[$parent.$index].newSelectedValue = answer.AnswerDesc; ctrl.selectDropdownOption(question.QuestionId, answer.AnswerId)">{{answer.AnswerDesc}}</a>
            </li>
        </ul>
    </div>
    <div id="save-profile" class="text-center form-submit">
        <button type="submit" data-ng-disabled="!customizeForm.$dirty" id="btn-profile-questionnaire" class="btn btn-card reverse" title="Save">
              Save</span>
              </button>
    </div>
</form>

0 个答案:

没有答案