How to disable the submit button,if radio button is not selecetd.Provided that radio button generates dynamic data from controller using ng-repeat in angularjs
1
-
Hard to tell what's the problem exactly, but docs have a good example docs.angularjs.org/api/ng/directive/ngDisabledLukasz Madon– Lukasz Madon2014-07-23 09:54:55 +00:00Commented Jul 23, 2014 at 9:54
Add a comment
|
3 Answers
I used ng-required="true" on inputs. And it worked.
Take a look at this plunker: http://plnkr.co/edit/NF5j2VC6prUCjRIk5bLW?p=preview
Comments
You can use ng-required on the radiobutton and in the submit button ng-disabled
http://plnkr.co/edit/h7FJljOXSaEjkKZ9L3S9?p=preview
Take a look at the ng-required and ng-disabled directives in this code:
<form name="myForm" ng-submit="submitForm()" ng-controller="ExampleController">
<input type="radio" ng-model="color" value="red" ng-required="!color"> Red <br/>
<input type="radio" ng-model="color" value="green" ng-required="!color"> Green <br/>
<input type="radio" ng-model="color" value="blue" ng-required="!color"> Blue <br/>
<tt>color = {{color | json}}</tt><br/>
<button
data-ng-disabled="myForm.$invalid"
type="submit">Submit</button>
</form>
3 Comments
sylwester
almost but not working please double check your plnkr
Braulio
How this plunkr works: if no radiobutton is selected submit button is disabled, if you select one of the options the radio buttons get selected is that the expected behavior?
Braulio
Well the question is: How to disable the submit button,if radio button is not select, nothing about showing an alert ;-)
http://plnkr.co/edit/lPOAaddGNBBOd8c9sWj2?p=preview
<form name="myForm" ng-submit="submitForm()" ng-controller="ExampleController">
<input type="radio" ng-model="color" value="red" > Red <br/>
<input type="radio" ng-model="color" value="green" > Green <br/>
<input type="radio" ng-model="color" value="blue" > Blue <br/>
<tt>color = {{color | json}}</tt><br/>
<button
data-ng-disabled="!color"
type="submit">Submit</button>
</form>
js:
angular.module('radioExample', [])
.controller('ExampleController', ['$scope', function($scope) {
$scope.color = '';
$scope.specialValue = {
"id": "12345",
"value": "green"
};
$scope.submitForm = function() {
alert('valid');
}
}]);