iJade
iJade

Reputation: 23811

HTML radio checked, not working along side AngularJS directive ngModel

I'm trying to set a default selection for a radio button, but it's not working when used along side AngularJS directive ngModel

<input type="radio" value="5000" checked ng-model="status">5000

Here is the DEMO

Upvotes: 0

Views: 870

Answers (2)

Wawy
Wawy

Reputation: 6269

You need to initialize the status scope property in your controller:

HTML:

<input type="radio" value="5000" checked ng-model="status">5000

JS:

angular.module("myApp", []).controller("test", function ($scope) {
    $scope.status = 5000;
});

DEMO

Upvotes: 0

V31
V31

Reputation: 7666

You can use ng-checked in this case. Updated Fiddle

HTML Code:

<div ng-app="myApp">
    <div ng-controller="test">
        <input type="radio" value="5000" ng-checked="status">5000
        <br/> <span>{{status}}</span>

    </div>
</div>

JS Code:

angular.module("myApp", [])

    .controller("test", function ($scope) {
    $scope.status = true;
});

UPDATE as per the OP comment:

fiddle

JS Code:

angular.module("myApp", [])

    .controller("test", function ($scope) {
    $scope.status = true;
    if (!$scope.status) $scope.radioValue = 0;
    else $scope.radioValue = 5000;
});

HTML Code:

<div ng-app="myApp">
    <div ng-controller="test">
        <input type="radio" value="5000" ng-checked="status" ng-model="radioValue">5000
        <br/> <span>{{radioValue}}</span>

    </div>
</div>

Upvotes: 1

Related Questions