jeudi 6 juillet 2017

checkbox validation angularjs

I have multiple checkboxes for a question.Atleast one checkbox needs to be selected.If none of the checkboxes get selected form should through validation error.Did i miss anything. Any ideas on how I would be able to achieve this behaviour? My .JS code:

$scope.onCheckBoxSelected=function(){

                            var flag=false;
                            for(var key in selectedOptions){
                                console.log('Key -' +key +' val- '+selectedOptions[key]);
                                if(selectedOptions[key]){
                                    flag=true;
                                }
                            }
                            if(!flag){
                                selectedOptions=undefined;
                            }
                        };

below is my html code :

<div class="grid">
    <div class="col flex-10  mandatoryField"
                            ng-class="{error: (!selectedOptions && formMissingFields)}">Hello please select atleast one</div>
                    <div class="col flex-2">
                    </div>
                    <div class="col flex-5">


                        <div style="padding-top: 2px">
                            <input type="checkbox"
                                name="apple" 
                                title="Select type" value="apple"
                                ng-model="apple" ng-change="onCheckBoxSelected()">apple
                            </input>
                        </div>
                        <div style="padding-top: 2px">
                            <input type="checkbox"
                                name="orange" 
                                title="Select type" value="orange"
                                ng-model="orange" ng-change="onCheckBoxSelected()">orange
                            </input>
                        </div>
                        <div style="padding-top: 2px">
                            <input type="checkbox"
                                name="banana" 
                                title="Select type" value="banana"
                                ng-model="banana" ng-change="onCheckBoxSelected()">banana
                            </input>
                        </div>



                    </div>



                </div>




Aucun commentaire:

Enregistrer un commentaire