CODEWITHSUNDEEP
javascriptangularjs
StrugglingCoder
StrugglingCoder

Reputation: 5021

ng-disabled in Angular JS

I have a modal popup with few mandatory fields.

   <form name="myReferenceDataForm" role="form" ng-submit="AddNewGroupMembershipReferenceRecord()" style="margin: 10px">
        <div class="form-group row">
            <div style="padding-bottom:5px; padding-top:5px; ">
                    <label for="GroupCode" class="col-sm-4 form-control-label">
                            Group Code <span class="requiredRed">*</span>
                    </label>
                    <div class="col-sm-8">
                        <input ng-model="referenceAddRecord.groupCode" class="form-control" id="GroupCode" type="text">
                    </div>
            </div>
        </div>
        <div class="form-group row">
            <div style="padding-bottom:5px; padding-top:5px; ">
                <label for="GroupName" class="col-sm-4 form-control-label">
                    Group Name <span class="requiredRed">*</span>
                </label>
                <div class="col-sm-8">
                    <input ng-model="referenceAddRecord.groupName" id="GroupName" class="form-control" type="text">
                </div>
            </div>
        </div>
        <div class="form-group row">
            <label for="GroupType" class="col-sm-4 form-control-label">Group Type </label>
            <div class="col-sm-8">
                <select name="selGroupType" id="selGroupType" class="form-control" ng-change="referenceAddRecord.populateGroupTypeDetails(selGroupType)" ng-options="groupType.value for groupType in referenceAddRecord.groupTypes track by groupType.id" ng-model="referenceAddRecord.groupType"></select>
            </div>
        </div>

Only above 3 fields groupName , groupCode are mandatory.

If they exist or not filled I want to have the submit button in the page disabled.

So , I did ...

        <input type="submit" class="btn btn-default pull-right" style="width:100px;" value="Submit" ng-disabled="!(referenceAddRecord.groupCode || referenceAddRecord.groupName)|| addReferenceDataGroupNameExists() || addReferenceDataGroupCodeExists()" />

But it is not working . Even Only the whether the fields are filled that check is failing. Whenever I enter only one field it is getting enabled.

        <input type="submit" class="btn btn-default pull-right" style="width:100px;" value="Submit" ng-disabled="!(referenceAddRecord.groupCode || referenceAddRecord.groupName)" />

What am I doing wrong here ?

Upvotes: 0

Views: 54

Answers (1)

cheralathan
cheralathan

Reputation: 572

Check out this plunker

<input type="submit" id="submit" ng-disabled="!(referenceAddRecord.groupName && referenceAddRecord.groupCode)" value="Submit" />

Upvotes: 2

Related Questions