CODEWITHSUNDEEP
javascriptangularjsangularjs-1.6
Burghi
Burghi

Reputation: 15

Angularjs ng-disabled not working properly

I'm trying to enable a button only when my input is filled with at least 18 characters. Here is the HTML code:

<form id="frm.frmEntidade" name="frm.frmEntidade">
  <div>
    <input type="text" ng-model="entidade.cnpj" id="cnpjEntidade" name="cnpjEntidade" required />
    <span class="input-group-btn">
        <button title="Buscar Entidade" class="btn btn-primary" 
              type="button" ng-click="buscarEntidade(entidade.cnpj)" ng-
              disabled="frm.frmEntidade.cnpjEntidade.lenght !== 18">
              <span class="glyphicon glyphicon-search"></span>
        </button>
  </div>
</form>

but the button stay awas disabled, anyone could help?

Upvotes: 1

Views: 1856

Answers (3)

Hadi
Hadi

Reputation: 17289

It's better use ng-minlength for form validation. by checking $valid you can enable or disable button

<form id="frm.frmEntidade" name="frm.frmEntidade">
<input type="text" ng-model="entidade.cnpj" id="cnpjEntidade" name="cnpjEntidade" required ng-minlength="18" />
    <span class="input-group-btn">
        <button title="Buscar Entidade" class="btn btn-primary" 
          type="button" ng-click="buscarEntidade(entidade.cnpj)" 
          ng-disabled="!frm.frmEntidade.$valid">
             <span class="glyphicon glyphicon-search"></span>
             Button
              </button>
   </span>  
</form>

Upvotes: 0

Durga
Durga

Reputation: 15604

try ng-disabled="entidade.cnpj.length!=18"

Upvotes: 0

Mistalis
Mistalis

Reputation: 18279

You have a typo error on the word length. Change:

<button [...]
        ng-disabled="frm.frmEntidade.cnpjEntidade.lenght !== 18">

To:

<button [...]
        ng-disabled="frm.frmEntidade.cnpjEntidade.length !== 18">

As a side note, this condition check if it is different from 18, not if "input is filled with at least 18 characters".

Upvotes: 2

Related Questions