javascript - 如何验证 ionic 单选按钮

标签 javascript html angularjs validation ionic-framework

我的表单有一组单选按钮。我可以验证其他字段,但验证单选按钮失败。我像这样验证其他字段

<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);

};

最佳答案

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);

   }

关于javascript - 如何验证 ionic 单选按钮,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/26589082/

相关文章:

javascript - JS : Why when I click the button nothing happens?

javascript - 无法正确编码前置记录器

html - 在列表中写入文本

php - 加载应出现在每个页面上的内容的最佳方式

javascript - 在 ng-model 中具有单向绑定(bind)的两个输入

javascript - AngularJS:关于实例化服务

angularjs - 如何使用 jqlite 以 Angular 获取元素的 attr 数据?

javascript - 使用循环用对象填充数组

javascript - knockout : Mapping with multiple keys

javascript - 离开页面后还保留dom吗?