Workaround Radio Button Selection

gistfile1.txt

    <div id="radio">
        <div class="hd">Header</div>
        <div class="bd">
            <form id="rform">
                <label><input type="radio" name="foo" value="1"> Hi-diddle-ee-dee...</label>
                <button>I’m a button, and I should get focus if my preceding <input> is not checked.</button>
                <label><input type="radio" name="foo" value="2" checked="checked"> a sailor’s life...</label>
                <label><input type="radio" name="foo" value="3"> for me!</label>
            </form>
        </div>
    </div>

    <script>
        var r = new YAHOO.widget.Panel("radio", {
            visible:false,
            close:false,
            width: 400 + 'px',
            x: 100,
            y: 100,
            modal:true
        });
        r.render();

        var f = YAHOO.util.Dom.get("rform");
 
        // You'd need to update these, every time radio selection changed, to reflect
        // the selected radio button. NOTE: you may only need to change one of these based
        // one whether or not you really have the potential for an unselected radio button
        // to be both the first and last element.

        r.firstElement = f.elements[1]; // Button
        r.lastElement = f.elements[2];  // Selected Radio
        r.setTabLoop(f.elements[1], f.elements[2]);

    </script>