Radio Buttons not checkable

Question

My webforms app includes a user control that uses a pair of radio buttons to enable to user to select either "Enter a new task", which causes a text box to display, or "Or select an existing task", which causes a listbox to display. I use jQuery to show and hide the textbox and listbox and this works with no problem.

My problem is with the radio buttons themselves. rdoNew always remains checked and rdoExisting unchecked regardless of clicking on either of them, although the two radio buttons have the same GroupName, "NewOrExisting". My question, of course, is how can I get these radio buttons to behave normally?

<%@ Control Language="VB" AutoEventWireup="false" CodeFile="Pop_Pretask.ascx.vb" Inherits="Pop_Pretask" %>

 <a href="#" style="display:none;visibility:hidden;" onclick="javascript:return false" id="hidlinkAddPretask" 
runat="server">dummy</a>

<cc1:ModalPopupExtender ID="mpePretask" runat="server"  PopupControlID="pnlPretask" TargetControlID="hidlinkAddPretask"
     CancelControlID="btnCancelPretask" PopupDragHandleControlID="lblDragHandlePretask"></cc1:ModalPopupExtender>

<asp:Panel ID="pnlPretask" runat="server" CssClass="popupPanel" Width="40%">

    <asp:UpdatePanel ID="updPretask" runat="server" ChildrenAsTriggers="false" UpdateMode="Conditional">
       <ContentTemplate>

               <asp:BulletedList ID="blAllPretasks" runat="server">
                </asp:BulletedList>

             <asp:HiddenField runat="server" ID="hidPostTaskID" Visible="true" />
            <asp:HiddenField runat="server" ID="hidGoalID" Visible="true" />

            <h2 runat="server" ID="lblDragHandlePretask" Width="100%">
                 Before <b>"<asp:Label ID="lblAddPretask" runat="server"></asp:Label>"</b> can be completed, I must:
            </h2>

           **<asp:RadioButton ID="rdoNew" GroupName="NewOrExisting" runat="server" AutoPostBack="false"
                Text="Enter a new task    " onclick="fnNewPretask();return false;" Checked="true"
                Enabled="true" />
           <asp:RadioButton ID="rdoExisting" GroupName="NewOrExisting" runat="server"  AutoPostBack="false"
                Text="Or select an existing task." onclick="fnExistingPretask();return false;" 
                Checked="false" Enabled="true" />**
           <asp:TextBox id="txtNewPretaskName" runat="server" width="100%" Visible="true"/>
           <br />
          <asp:ListBox ID="lboxPretask" runat="server" Width="100%" Height="200px"
                 AutoPostBack="false"
                 SelectionMode="Single"
                Style="display:none"
              >
          </asp:ListBox>

       </ContentTemplate>
        <Triggers>
            <asp:AsyncPostBackTrigger ControlID="btnAddAnotherPretask" EventName="Click" />
        </Triggers>
    </asp:UpdatePanel>

    <asp:UpdateProgress ID="UpdateProgress4" runat="server" DisplayAfter="0">
        <ProgressTemplate>
            <img src="images/progress.gif" alt="" />&nbsp;Updating...
        </ProgressTemplate>

    </asp:UpdateProgress>

    <br />
    <asp:Label runat="server" ID="lblErrPretask" Font-Bold="True" ForeColor="Red" />

    <asp:Button ID="btnAddAnotherPretask" runat="server" Text="Save and Add Another" />
    <asp:Button ID="btnSavePretask" runat="server" Text="Save" />
    <asp:Button ID="btnCancelPretask" runat="server" Text="Cancel"   OnClientClick="return false;" />

</asp:Panel>

<script type="text/javascript">

    function fnNewPretask() {
        //$("#<%=rdoExisting.ClientID%>").attr('checked', false);
        //$("#<%=rdoNew.ClientID%>").attr('checked', true);
        $("#<%=txtNewPretaskName.ClientID %>").show();
        $("#<%=lboxPretask.ClientID %>").hide();
    }

    function fnExistingPretask() {
        //$("#<%=rdoNew.ClientID%>").attr('checked', false);
        //$("#<%=rdoExisting.ClientID%>").attr('checked', true);
        $("#<%=txtNewPretaskName.ClientID%>").hide();
        $("#<%=lboxPretask.ClientID %>").show();
    }

</script>

As the above code shows, the radio buttons are inside a ModalPopupForm which in turn contains an UpdatePanel (which is required so that the listbox can be populated at the server each time the popup is summoned). These complications may be causing the radio buttons to malfunction.

Thanks in advance for any advice.

Answer 1

I got the answer to this problem from another source. The problem was with the javascript "return false;" which I added to the end of the onclick for each radio button. I was under the erroneous impression that one should always add "return false;" to prevent the page from posting back to the server. I know better now.