CODEWITHSUNDEEP
angularjs
user3691221
user3691221

Reputation: 109

How can I check number of elements on a select list and disable radio button?

I would like to:

How can I do that in angular?

This is my html:

<div ng-controller="AdvertisementCtrl">
    <form ng-submit="save()">

        <input type="radio" ng-model="advertisementType" name="advertisementType" value="false">Update<br />

        <select ng-model="updateAdvertisement" name="updateAdvertisement" ng-show="advertisementType == 'false'">
            <option value>Select item</option>
            <option value="1">Volvo</option>
            <option value="2">Saab</option>
            <option value="3">Mercedes</option>
            <option value="4">Audi</option>
        </select>

        <input type="submit" value="Save" name="saveButton" ng-disabled="saveButton" />

    </form>
</div>

This is my javascript (but I have no idea):

<script>
    function AdvertisementCtrl($scope) {

    }
</script>

Upvotes: 0

Views: 1003

Answers (2)

Anders Bornholm
Anders Bornholm

Reputation: 1336

  1. Populate the select from an array that you declare in the controller
  2. Check array length and disable the radio button when array length is 1

  3. Disable saveButton based on the value of updateAdvertisement

    <script>
function AdvertisementCtrl($scope) {
    $scope.cars = ['Volvo', 'Saab', 'Mercedes', 'Audi', 'BMW'];
}
</script>

Markup:

   <div ng-controller="AdvertisementCtrl">
       <form ng-submit="save()">
       <input type="radio" ng-model="advertisementType" name="advertisementType" value="false" ng-disabled="cars.length <= 1">Update<br />
       <select ng-model="updateAdvertisement" name="updateAdvertisement" ng-show="advertisementType == 'false'" ng-options="cars">
       </select>
       <input type="submit" value="Save" name="saveButton" ng-disabled="updateAdvertisement" />
       </form>
   </div>

Should probably be tested in a fiddle :-), could do that later

Upvotes: 0

rchawdry
rchawdry

Reputation: 1266

HTML

<div ng-controller="AdvertisementCtrl">

    <form ng-submit="save()">

        <input type="radio" ng-model="advertisementType" name="advertisementType" ng-disabled='carTypes.length<=1' value="false">Update<br />

        <select ng-model="updateAdvertisement" name="updateAdvertisement" ng-options="item.type for item in carTypes">
            <option value>Select item</option>
        </select>

        <input type="submit" value="Save" name="saveButton" ng-disabled="!updateAdvertisement" />

    </form>

</div>

JavaScript

function AdvertisementCtrl($scope) {
    $scope.carTypes = [
        {id:'1', type:'Volvo'},
        {id:'2', type:'Saab'},
        {id:'3', type:'Mercedes'},
        {id:'4', type:'Audi'}
    ]
}

The JSFiddle is here http://jsfiddle.net/7Jw9B/

Upvotes: 1

Related Questions