如何根据下拉选择设置单选按钮值

How to set radio buttons values based on dropdown selection?

本文关键字:设置 单选按钮 选择 何根      更新时间:2023-09-26

我想根据下拉选择设置单选按钮值,假设我在下拉列表中有三个值(A、B和C),如果选择了A或B,我想将单选按钮默认值设置为Summary,如果选择C,我想设置值为Detailed。同样当A&选择了B,我想使其不可编辑。。请帮忙,这是我第一次使用AngularJS收音机。

main.html

<div class="row">
    <div class="form-group col-md-6 fieldHeight">
        <label for="cycleName" class="col-md-6 required">Scope Type :</label>
        <div class="col-md-6">
            <select kendo-drop-down-list k-data-text-field="'text'"
                k-option-label="'Select'" k-data-value-field="'id'"
                k-data-source="assessmentTypeOptions" name="assessmentType"
                required ng-model="riskAssessmentDTO.scopeType" id="assessmentType"
                maxlength="256" ng-change="assessmentType()"></select>
                <p class="text-danger"
                    ng-show="addAssessment.assessmentType.$touched && addAssessment.assessmentType.$error.required">Assessment
                    Type is required</p>
        </div>
    </div>
    <div class="form-group col-md-6 fieldHeight">
        <label for="assessmentType" class="col-md-5 required">Assessment Type :</label>
        <label class="radio-inline"><input type="radio"
            name="summary" id="summary" ng-value="'summary'"
            ng-model="riskAssessmentDTO.erhFlag" ng-disabled="disableAssessmentType" >Summary </label>
        <label class="radio-inline"><input type="radio"
            name="detail" id="detail" ng-value="'N'"
            ng-model="riskAssessmentDTO.erhFlag" ng-disabled="disableAssessmentType">Detailed</label>
        <p class="text-danger"
            ng-show="addAssessment.includeERHFlag.$touched && addAssessment.includeERHFlag.$error.required">Assessment
            Name is required</p>
    </div>
</div>

main.js

$scope.assessmentType = function() {
                        $scope.riskAssessmentDTO.assessmentName = '';
                        $scope.riskAssessmentDTO.erhFlag = 'Y';
                        $scope.showRefineERH = false;
                        if ($scope.riskAssessmentDTO.scopeType === 'RA_GEO_LOCAT') {
                            $scope.disableAssessmentType = true;
                            $scope.riskAssessmentDTO.erhFlag = 'summary';
                        } else if ($scope.riskAssessmentDTO.scopeType === 'RA_LEGAL_ENTITY') {
                            $scope.disableAssessmentType = true;
                            $scope.riskAssessmentDTO.erhFlag = 'summary';
                        } else if ($scope.riskAssessmentDTO.scopeType === 'RA_BUS_UNIT') {
                            $scope.disableAssessmentType = false;
                            $scope.riskAssessmentDTO.erhFlag = 'detailed';
                        } 
                    };

在单选按钮中使用禁用的ng,并使用范围变量$scope.selectedIndex将其设置为false或true

<input type="radio" ng-disabled="selectedInderx==0">

并通过从html 传递$index来在Select中的ng更改函数中设置$scope.selectedIndex