【问题标题】:ng-disabled validation prblemng禁用验证问题
【发布时间】:2016-07-20 23:17:55
【问题描述】:

我在验证时遇到问题,我在未验证表单时在按钮上使用了 ng-disabled。我在表单中有 2 个输入,问题是当我在第二个输入中输入值而第一个是空的(首先使用自动完成)时,按钮被启用,但除此之外它可以工作,我不希望那个用户在输入按钮时只输入“neto”启用后,看起来 angular 没有将 angucomplete 视为表单的一部分。

    <form name="usForm" role="form" novalidate>

  <div>
  <table class="table table-striped table-hover table-responsive">
    <thead>
      <tr>
        <th>Stavka</th>
        <th>Količina</th>
        <th></th>
      </tr>
    </thead>
    <tbody>        
      <tr>
        <td>
          <div angucomplete-alt
            id="norma.idartcle"
            placeholder="Aricle"
            pause="100"
            selected-object="object"
            local-data="getarticles"
            search-fields="pass,name"
            title-field="pass,name"
            description-field="norm"
            minlength="2"
            input-class="form-control form-control-small"
            match-class="highlight"
            input-changed="norm.idarticle"
            field-required="true"
            text-no-results="It doesnt exist"
            text-searching="Searching..."
            >
          </div>
        </td>
        <td>
           <div class="form-group">
              <input type="text" class="form-control" name="neto" id="neto" placeholder="Neto" ng-model="norm.neto"  ng-maxlength="6" required />
            </div>
        </td>
        <td colspan="3">
            <button class="btn btn-primary"  ng-disabled="usForm.$invalid" ng-click="addNorm(object)">Add</button>
            <button class="btn btn-default"  ng-click="clearForm()">Leave</button>
        </td>
      </tr>
    </table>
  </div>
</form>

【问题讨论】:

    标签: angularjs validation autocomplete


    【解决方案1】:

    您需要按照...提供的示例进行操作

    http://ghiden.github.io/angucomplete-alt/

    特别注意验证示例 - 示例 8

    这里所有字段都是 angucomplete - 没有将 angucomplete 与正常输入混合的示例。这并不意味着 angucomplete 在与正常输入混合时不起作用,它只是意味着它可能不起作用!

    angucomplete 上的示例也使用 angular 1.4.6,因此请确保它不是 angular 版本问题。

    【讨论】:

    • 版本不是问题,我还是不能让它工作
    • 我建议您尽可能简化您的解决方案并慢慢构建它 - 从一个有效的基本示例开始,从上面的示例 8 复制并粘贴并慢慢构建它,确保您没有破坏任何东西
    猜你喜欢
    • 1970-01-01
    • 2015-01-11
    • 2021-11-30
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    相关资源
    最近更新 更多