0

HI guys, I'm having a problem with hiding and showing a panel that contains a text box. Basically the panel is hidden and whenever a radio box is selected the panel should show but it won't work.

Here is the code:

 <div class="expensesForm">
        <div class="control-group">
            <label class="control-label" for="rent">Rent</label>
            <div class="controls">
                <asp:RadioButton ID="rent" runat="server" GroupName="expenses" OnCheckedChanged="CheckedChanged" />            
            </div>
        </div>
        <div class="control-group">
            <label class="control-label" for="car">Car</label>
            <div class="controls">
                <asp:RadioButton ID="car" runat="server" GroupName="Expenses" OnCheckedChanged="CheckedChanged" />
            </div>
        </div>
        <div class="control-group">
            <label class="control-label" for="bills">Bills</label>
            <div class="controls">
                <asp:RadioButton ID="bills" runat="server" GroupName="Expenses" OnCheckedChanged="CheckedChanged" />            
            </div>
        </div>
        <div class="control-group">
            <label class="control-label" for="food" AssociatedControlID="food">Food</label>
            <div class="controls">
                <asp:RadioButton ID="food" runat="server" GroupName="Expenses" OnCheckedChanged="CheckedChanged" />            
            </div>
        </div>
         <div class="control-group">
             <asp:Panel ID="amount" runat="server">
                  <label class="control-label" for="bills">Enter amount</label>
                <div class="controls">
                    <asp:TextBox ID="TextBox1" runat="server" Visible="True"></asp:TextBox>
                </div>
            </asp:Panel>
        </div>
    </div>

And the code behind here, however when I select the radio button the panel doesn't appear:

using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.UI;
using System.Web.UI.WebControls;

public partial class Home : System.Web.UI.Page
{
    protected void Page_Load(object sender, EventArgs e)
    {
        if (!IsPostBack) {//returns false the first time the page is displayed true when redisplayed
            initForm();
        }

    }
    private void initForm() {
        amount.Visible = false;//hide amount info on page load
        rent.Checked = false;//unselect all radio buttons
        car.Checked = false;
        bills.Checked = false;
        food.Checked = false;

    }
    protected void CheckedChanged(object sender, EventArgs e)
    {
        amount.Visible = true;//showamount info on page load
    }
}
2
Contributors
4
Replies
15
Views
2 Years
Discussion Span
Last Post by Violet_82
0

For this to work as you have designed, you'd have to set the radio buttons to autopostback.

<asp:RadioButton ID="fo......... AutoPostBack="True" /> 

I really find it inefficient to post back just to show/hide/toggle views. You should consider doing this with js/jQuery instead, just my opinion, unless there is some processing that has to happen server side.

0

Ah, of course, the function is not called unless I post back!! Darn! Yes, I can certainly do it with Jquery, that was in fact my first thought, but I did it with C# because I wanted to practice : - ), and I thought that for such a small application it won't matter that much if I use server processing

Edited by Violet_82

This question has already been answered. Start a new discussion instead.
Have something to contribute to this discussion? Please be thoughtful, detailed and courteous, and be sure to adhere to our posting rules.