如何验证离子单选按钮答案

【问题标题】：how to validate ionic radio buttons如何验证离子单选按钮
【发布时间】：2014-12-22 17:18:46
【问题描述】：

我有一个包含一组单选按钮的表单。我可以验证其他字段，但无法验证单选按钮。我像这样验证我的其他字段

<div class="form-group" ng-class="{ 'has-error' : (userForm.originAcc.$invalid || userForm.originAcc.$pristine) && submitted }">
    <label class="labelColor"><h5><b>Source Account Number *</b></h5></label>
    <select id="originAcc"  name="originAcc"style="margin: auto; width:100%" ng-model="user.originAcc"  ng-options="account.account for account in accountsArr"required>
        <option value="" >--Select Account--</option>
    </select>
    <span class="help-inline" ng-show="(userForm.originAcc.$pristine && submitted) ||( userForm.originAcc.$error.required && submitted)" >Source Account Number cannot be left blank.</span>
</div>

使用 has-error 类我验证了这些字段。我怎样才能像那样验证单选按钮？

我的单选按钮 html

<label class="labelColor"><h5><b>Select Standing Order Type</b></h5></label>
<div class="list">
<ion-radio ng-repeat="item in clientSideList" ng-value="item.value" ng-model="user.clientSide" required>
    {{ item.text }}
</ion-radio>
</div>

单选按钮js

$scope.move = function () {

    var path;
    switch($scope.user.clientSide) {
        case 'ftso': path = 'app/so/fundtransferOrder'; break;
        //case 'oaso': path = 'app/so/ownstanding'; break;
        case 'utso': path = 'app/so/utilitytransferOrder'; break;
    }
    $location.path(path);

};

【问题讨论】：

标签： javascript html angularjs validation ionic-framework

【解决方案1】：

HTML 部分

<div class="form-group" ng-class="{ 'has-error' : thirdPartyForm.clientSide.$invalid && thirdPartyForm.clientSide.$dirty && submitted || (thirdPartyForm.clientSide.$invalid && thirdPartyForm.clientSide.$pristine) && submitted }" ng-init="data.type ='INTERNAL';transactionTypeChange('INTERNAL');hideFields();banksArray();">

    <div class="list">
        <ion-radio ng-repeat="item in accTypeList" name="clientSide" id="clientSide" ng-value="item.value" ng-model="data.type" ng-change="transactionTypeChange(item.value);hideFields(item.value);banksArray();pop();" required>
            {{ item.text }}
        </ion-radio>
    </div>
    <span class="help-inline" ng-show="submitted && userForm.clientSide.$error.required" >Type cannot be left unselected.</span>
</div>

JS部分

 $scope.accTypeList = [{text: "*************", value:"INTERNAL"}, {text:"Other Banks", value:"OTHER"}];

   $scope.transactionTypeChange = function(obj){

   if(obj.localeCompare('OTHER')==0){
   $scope.listOne= [{"id":"1","name":"Transfer (SLIPS)"},{"id":"2","name":"Transfer (CEFTS)"}];
   $scope.data.transtype =  $scope.listOne[0];
   $scope.validateDestAccFlag = false;
   } else if(obj.localeCompare('INTERNAL')==0){
   $scope.listOne = [{"id":"1","name":"****************"}];
   $scope.data.transtype =  $scope.listOne[0];
 ;
   $scope.validateAccFlag= true;
   $scope.validateDesitinationAccount($scope.data.origin, $scope.data.beneAcc);

   }

【讨论】：