CODEWITHSUNDEEP
formsangularvalidation
rematnarab
rematnarab

Reputation: 1325

Required disabled field`s validation returns false even the input field is filled in angular 2

I have an input field in a form which is filled but disabled (I am trying to build details view). In the code below titleAccessor.valid returns false. Any ideas how to overcome this issue ?

 <div class="form-group row">
     <label class="col-md-3 form-control-label" for="title">{{'contentSalesTextConfig.titleForm'|translate}}</label>
         <div class="col-md-9">
            <input [disabled]="pageStatus==4" required [ngClass]="{'redBorder': ((titleAccessor.touched||formSubmitted)&&!titleAccessor.valid)}" [ngModel]="textContentMain.title" #titleAccessor="ngModel" name="title" id="title"  type="text" class="form-control" placeholder="{{'contentSalesTextConfig.placeHolder.titleForm'|translate}}">
         </div>
 </div>

NOTE: When i remove [disabled]="pageStatus==4" validation works as it is supposed to..

Upvotes: 0

Views: 250

Answers (1)

Mohamed Ali RACHID
Mohamed Ali RACHID

Reputation: 3297

disabled inputs are considered as invalid inputs , you can use readonly instead of disabled :

<input [readonly]="pageStatus==4" required [ngClass]="{'redBorder': ((titleAccessor.touched||formSubmitted)&&!titleAccessor.valid)}" [ngModel]="textContentMain.title" #titleAccessor="ngModel" name="title" id="title"  type="text" class="form-control" placeholder="{{'contentSalesTextConfig.placeHolder.titleForm'|translate}}">

hope this will help :)

Upvotes: 2

Related Questions