Has selecting radio buttons changed since IPA1?

I tried running the code from a previous post regarding IPA1 about programmatically selecting a radio button. However, I keep getting this error:

BREAK: call setSelected: no function!

Has the behavior changed? I'm using the same code as what was posted...

Also as a side note, would anyone have any idea why whenever we transition back to our screen the radio buttons decide to duplicate themselves every time?


  • I think setSelected should still work. Though you might (maybe) have to delegate it to the content now instead of calling it directly? Try myRadioButton.distribute("setSelected", isSelected, isSilent)

  • I believe that resolves the issue, because once I changed it to that I stopped getting errors. However I'm unable to really test it because the radio group is misbehaving. Every time I switch to another screen and then go back to the screen with the radio buttons, they get duplicated. I have 2 buttons, AM and PM. If I leave and come back, I have one group with 4 buttons: AM PM AM PM. This happens on every screen I try to place the buttons. I've tried redeclaring the radio group whenever the page is loaded, changing the button names, setting the group to invisible, etc, and nothing works. This is the only UI element I'm having an issue with. Do you have any idea what could be causing it?

  • Wacky. If I were you I'd just be regenerating screens on-demand rather than keeping them around. But that is weird... I wonder why it does that. I'll poke around.

  • I kind of agree, but we've been rolling with this up until now and changing it to create a new instance of the screen would require ripping out and rewiring a lot of code. I appreciate the help, please let me know what you find out!

  • So, the problem is easy to see. The way that the individual buttons get added is in onDisplaying. That means that every time that content gets redisplayed, it will repopulate them.

    Definitely a bug in the controls library... the question is what to do about it in the short term.

    You could just remove and re-add the radio group whenever you switch back to that screen. Remember the selection and re-select it... That's probably the easiest option.

  • So how would I go about removing it then? Right now it's in createScreen.column.time as the last element, but when I try to run createScreen.column.time.remove(createScreen.column.time.time_buttons) it won't work. It says there is no function remove.

  • I figured it out. Turns out time is some sort of keyword, so changing the name was what was needed. There was one extra step. I not only needed to remove the buttons from the container, but I also needed to recreate a free radio group before re-adding them. Now no more duplicates!

  • Hey Andy, one last question. It turns out that the code you gave me actually doesn't work. I've tried both the original way of programmatically setting a radio button and the way you just posted, but it won't cooperate. My radio group is called am_pm. I've tried to do am_pm.first.next.distribute(stuff) and also just am_pm.distribute(stuff). Also it keeps saying that isSelected and isSilent are not valid values, but even after replacing them with booleans (true/false) it won't work. Any ideas? Thanks so much for looking into all this for me.

  • Answer ✓

    Okay. I've learned all about radio buttons this evening.

    First, you apparently can now set the selected radio button when you create the buttons. That looks like this:

    var radioGroup = new myRadioGroup({ buttonNames: "Lorem,Ipsum,Dolor,Sit,Amet", selected:"Dolor" });

    Second, it appears there's a totally new way to set the selected radio button at runtime. Say I have a variable holding a radio group named radioGroup and I want to select the kth item in that radio group. That looks like this:

    radioGroup.delegate("onGroupButtonSelected", radioGroup[k]);

    So, want to select the first item in the list?

    radioGroup.delegate("onGroupButtonSelected", radioGroup[0]);

    Second one?

    radioGroup.delegate("onGroupButtonSelected", radioGroup[1]);


    — Andy

  • edited May 2015

    That is lovely! So so sooo much cleaner than what I did. After a few hours of tweaking with this, I figured out a way to do this in a much more painful way. So essentially what I was trying to do was when you were editing a previous entry, you could mark the button as PM instead of AM so that you could continue where you left off. What I ended up doing was making a variable, and then in the onDisplayed function of my container, I would check the PM boolean and then use distribute("setSelected", true, true) on the PM button and then distribute("setSelected", false, true") on the AM button. Your way seems much better!

    Edit: Just tried implementing it though, doesn't seem to work. I get a cannot coerce undefined to instance. Does this need to be called in a function like onDisplayed or something?

    Edit: Yup, appears to be the case. Can't call it outside those functions, so essentially that line just condenses mine into 1. :) Thanks for looking into it for me!

Sign In or Register to comment.