I have a radio button in my XMLview as shown below. The data is bound from the model. My requirement is to validate the radio buttons after the data binding. Below is my controller code. i am trying to read the value of the selectedButton text in my controllers AfterRendering method.

XML View:

<RadioButtonGroup id="rbgtype" > 
<RadioButton text="Yes" selected="{/rbgtype}"/> 
<RadioButton text="No" selected="{=!${/rbgtype}}"/> </RadioButtonGroup>

Controller

onAfterRendering: function () { 
var that = this; console.log("rbgtype"+that.getView().byId("rbgtype").getSelectedButton().getText());} 

Strangely I am always getting the value "Yes" , irrespective of selected value. Can some one advise where I am doing wrong please.

I have a radio button in my XMLview as shown below. The data is bound from the model. My requirement is to validate the radio buttons after the data binding. Below is my controller code. i am trying to read the value of the selectedButton text in my controllers AfterRendering method.

XML View:

<RadioButtonGroup id="rbgtype" > 
<RadioButton text="Yes" selected="{/rbgtype}"/> 
<RadioButton text="No" selected="{=!${/rbgtype}}"/> </RadioButtonGroup>

Controller

onAfterRendering: function () { 
var that = this; console.log("rbgtype"+that.getView().byId("rbgtype").getSelectedButton().getText());} 

Strangely I am always getting the value "Yes" , irrespective of selected value. Can some one advise where I am doing wrong please.

• javascript
• sapui5

Share Improve this question Follow asked Sep 11, 2018 at 22:53 lampstandlampstand 11133 silver badges1515 bronze badges

Add a ment  | 

2 Answers 2

Sorted by: Reset to default 4

It does that because the RadioButtonGroup doesn't initially have a property set selectedIndex. It seems to fail the getSelectedButton method whenever selectedIndex isn't set.

Maybe you can work around this issue like this? Hope this helps.

View

        <RadioButtonGroup id="rbgtype" selectedIndex ="{/rbgtype}">
            <RadioButton text="Yes" />
            <RadioButton text="No"/>
        </RadioButtonGroup>

Controller

        onInit: function() {
        var type = false;
        var oModel = new JSONModel({
            rbgtype: type ? 0 : 1
        });

        this.getView().setModel(oModel);
    },

    onAfterRendering: function() {
        sap.m.MessageToast.show("rbgtype: " + this.byId("rbgtype").getSelectedButton().getText());
    },

VIEW 2

<RadioButtonGroup id="rbgtype" selectedIndex ="{= ${rbgtype} ? 0 : 1 }">
            <RadioButton text="Yes" />
            <RadioButton text="No"/>
</RadioButtonGroup>

Please check your xml view radionbuttongroup aggregation and binding

<RadioButtonGroup id="rbgtype" >
                <buttons>


<RadioButton text="Yes" selected="{/rbgtype}"/> 
<RadioButton text="No" selected="{=!${/rbgtype}}"/> </RadioButtonGroup>
                </buttons>
            </RadioButtonGroup>

Once you fix it then you can add an event delegate for onAfterRendering in onInit function of the controller

see example below

var rbGrp= this.getView().byId("rbgtype");

rbGrp.addEventDelegate({

onAfterRendering:function(){/*write your code here*/}                                                        

      }, this);

Hope this helps. Any issues let me know