Angularjs set checked radio not working

Question

I have 3 radio buttons:

            <label ng-repeat="mode in opMode.groupMode" class="radio-inline" title="{{mode.title}}">
                <input id="rd{{mode.id}}" type="radio" class="panel-load-radio" ng-model="opdtMode.groupMode"
                       name="inlineRadioOptions" value="{{mode.id}}" 
                       ng-change="changeOpdtMode(mode.id, '{{opdtMode.groupMode}}')">
                {{mode.name}}
            </label>

Here is Angularjs code:

$scope.opMode = { groupMode: [
   { name: "ModuleType", title: "Load processes by Module type", id: "ModuleType", isDefault: false },
   { name: "OpGroup", title: "Load processes by Operation group", id: "OpGroup", isDefault: true },
   { name: "MachineType", title: "Load processes by Machine type", id: "MachineType", isDefault: false  }
]};

If isChange = true, show confirm mbox. If User click cancel, set oldValue and checked previous radio. I wrote this. However it's not working as expected:

$scope.changeOpdtMode = function (newValue, oldValue) {
    if(isChange){
        const msg = getMsgById(29, msgLostData);
        const r = confirm(msg.value);
        if (r === true) {
            const lang = $scope.layoutLang.selectedLang;
            loadLayout(null, lang, newValue);
            window.isChange = false;
        } else {
            $scope.opdtMode.groupMode = oldValue;
        }
    }else{
        const lang = $scope.layoutLang.selectedLang;
        loadLayout(null, lang, newValue);
    }     
}

Nguyễn Minh Vương · Accepted Answer · 2018-03-27 08:52:06Z

After 2 hours researched: I post my answer here for everyone may see as the same issue.

<label ng-repeat="mode in opMode" class="radio-inline" title="{{mode.title}}">
    <input type="radio" class="panel-load-radio" ng-value="mode.id"
           ng-model="$parent.opdtMode" ng-change="changeOpdtMode(mode.id, '{{opdtMode}}')">
    {{mode.name}}
</label>

Need to remove name="inlineRadioOptions" and add $parent into the model.

$scope.opdtMode = "OpGroup";
$scope.opMode = [{ name: "ModuleType", title: "Load processes by Module type", id: "ModuleType" },
   { name: "OpGroup", title: "Load processes by Operation group", id: "OpGroup" },
   { name: "MachineType", title: "Load processes by Machine type", id: "MachineType" }];

$scope.changeOpdtMode = function (newValue, oldValue) {
    if(isChange){
        const msg = getMsgById(29, msgLostData);
        const r = confirm(msg.value);
        if (r === true) {
            const lang = $scope.layoutLang.selectedLang;
            loadLayout(null, lang, newValue);
            window.isChange = false;
        } else {
            $scope.opdtMode = oldValue;
        }
    }else{
        const lang = $scope.layoutLang.selectedLang;
        loadLayout(null, lang, newValue);
    }     
}

Collectives™ on Stack Overflow

Angularjs set checked radio not working

1 Answer 1

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Related