Update panel Avoid page reload when Radio button is checked not working

user_319075 0
Viewed 190

I am trying to use 2 Radio buttons and swap the view according to the radio button selected, but it's not working, the page does not reload and nothing happens. can someone tell me where is the problem?

        <%@ Page Title="" Language="C#" MasterPageFile="~/Admin Part/Admin.Master" AutoEventWireup="true" CodeBehind="DataEntry.aspx.cs" Inherits="_4Kids.Admin_Part.DataEntry" EnableEventValidation="false" %>
        
        <%@ Register Assembly="System.Web.Extensions, Version=1.0.61025.0, Culture=neutral, PublicKeyToken=31bf3856ad364e35" Namespace="System.Web.UI" TagPrefix="ajaxToolkit" %>
        <%@ Register Assembly="AjaxControlToolkit" Namespace="AjaxControlToolkit" TagPrefix="ajaxToolkit" %>           <asp:ScriptManager ID="ScriptManager1" runat="server" EnablePartialRendering="true"></asp:ScriptManager>
    
    <asp:Content ID="Content1" ContentPlaceHolderID="MainContent" runat="server">
                                <asp:UpdatePanel ID="upd" runat="server" UpdateMode="Conditional">
                                    <ContentTemplate>
<table>
<tr>
                                        <td style="height: 21px;">
                
                                            <asp:RadioButton ID="rdb_Preterm" runat="server" Text="Preterm" AutoPostBack="true" OnCheckedChanged="rdb_Preterm_CheckedChanged" />
                                            <asp:RadioButton ID="rdb_Fulterm" runat="server" Text="Full term" AutoPostBack="true" OnCheckedChanged="rdb_Fulterm_CheckedChanged" />
                
                                        </td>
                                        <td style="height: 21px;">
                                            <asp:MultiView ID="Mul" runat="server">
                                                <asp:View ID="view_null" runat="server"></asp:View>
                                                <asp:View ID="view_weeks" runat="server">
                                                    <table>
                                                        <tr>
                                                            <td>
                                                                <asp:Label ID="Label14" runat="server" Text="Weeks:"></asp:Label>
                                                            </td>
                                                            <td>
                                                                <asp:TextBox ID="txt_pretermWeeks" runat="server"></asp:TextBox>
                                                            </td>
                                                        </tr>
                                                    </table>
                                                </asp:View>
                                            </asp:MultiView>
                                        </td>
</tr>
</table>
                                    </ContentTemplate>
                                    <Triggers>
                                        <asp:AsyncPostBackTrigger ControlID="rdb_Preterm" EventName="CheckedChanged" />
                                        <asp:AsyncPostBackTrigger ControlID="rdb_Fulterm" EventName="CheckedChanged"/>
                                    </Triggers>
                                </asp:UpdatePanel>
            
    </asp:Content>
ajaxcontroltoolkit updatepanel asp.net
1 Answers

A few things: In your posted markup, I don't seen anything related to the ajaxtoolkit.

So, remove that stuff. Also, remove the post back triggers. They are really for causing OTHER update panels to trigger - and you don't have multiple panels, so dump that stuff.

You do however need the script manager due to use of the update panel.

So, we now have this:

    <asp:ScriptManager ID="ScriptManager1" runat="server"></asp:ScriptManager>
    <asp:UpdatePanel ID="upd" runat="server" UpdateMode="Conditional">
        <ContentTemplate>
            <table>
            <tr>
            <td style="height: 21px;">                
                <asp:RadioButton ID="rdb_Preterm" runat="server"
                    Text="Preterm" AutoPostBack="true" OnCheckedChanged="rdb_Preterm_CheckedChanged" />
                <asp:RadioButton ID="rdb_Fulterm" runat="server" 
                    Text="Full term" AutoPostBack="true" OnCheckedChanged="rdb_Fulterm_CheckedChanged" />                
            </td>
            <td style="height: 21px;">
                <asp:MultiView ID="Mul" runat="server">
                    <asp:View ID="view_null" runat="server"></asp:View>
                    <asp:View ID="view_weeks" runat="server">
                        <table>
                            <tr>
                                <td>
                                    <asp:Label ID="Label14" runat="server" Text="Weeks:"></asp:Label>
                                </td>
                                <td>
                                    <asp:TextBox ID="txt_pretermWeeks" runat="server"></asp:TextBox>
                                </td>
                            </tr>
                        </table>
                    </asp:View>
                </asp:MultiView>
            </td>
            </tr>
            </table>
        </ContentTemplate>
    </asp:UpdatePanel>

And you code behind can be this:

    protected void Page_Load(object sender, EventArgs e)
    {
    }

    protected void rdb_Preterm_CheckedChanged(object sender, EventArgs e)
    {
        if (rdb_Preterm.Checked)
        {
            rdb_Fulterm.Checked = false;
            Mul.SetActiveView(view_null);
        }
    }

    protected void rdb_Fulterm_CheckedChanged(object sender, EventArgs e)
    {
        if (rdb_Fulterm.Checked)
        {
            rdb_Preterm.Checked = false;
            Mul.SetActiveView(view_weeks);
        }
    }

That's all you really should need here. As noted, no need for the triggers, you ALREADY have postback=true for the radio buttons.

user_105270
Related