How to hide panel when radio button is selected

Question

Dear All I have webform with 4radio buttons as options & with 4panels. & view button Initially all panels are in disable mode. When i select 1st radion button 1st panel will be visible mode & if i select 2nd one then 2nd panel so on. finally when i click view button i need to identify which option is selected so that i need to perform some operations. In which event i need to write & how to do this?

SIVA · Answer

Thanks nice sharing...

Senthilkumar · Answer

Hi If you have limited options then you can have radiobutton. otherwise go for radiobuttonlist control. In design page oncheckedchanged=rdb1_CheckedChanged /> oncheckedchanged=rdb2_CheckedChanged /> oncheckedchanged=rdb3_CheckedChanged /> oncheckedchanged=rdb4_CheckedChanged /> Panel1 Panel2 Panel3 Panel4 In the code file protected void rdb1_CheckedChanged(object sender EventArgs e) { panel1.Visible = true; panel2.Visible = false; panel3.Visible = false; panel4.Visible = false; } protected void rdb2_CheckedChanged(object sender EventArgs e) { panel1.Visible = false; panel2.Visible = true; panel3.Visible = false; panel4.Visible = false; } protected void rdb3_CheckedChanged(object sender EventArgs e) { panel1.Visible = false; panel2.Visible = false; panel3.Visible = true; panel4.Visible = false; } protected void rdb4_CheckedChanged(object sender EventArgs e) { panel1.Visible = false; panel2.Visible = false; panel3.Visible = false; panel4.Visible = true; } Using javascript: /> /> /> /> Panel1 Panel2 Panel3 Panel4 function ShowPanel(id) { switch(id) { case 1: document.getElementById('panel1').style.display=''; document.getElementById('panel2').style.display='none'; document.getElementById('panel3').style.display='none'; document.getElementById('panel4').style.display='none'; break case 2: document.getElementById('panel1').style.display='none'; document.getElementById('panel2').style.display=''; document.getElementById('panel3').style.display='none'; document.getElementById('panel4').style.display='none'; break case 3: document.getElementById('panel1').style.display='none'; document.getElementById('panel2').style.display='none'; document.getElementById('panel3').style.display=''; document.getElementById('panel4').style.display='none'; break case 4: document.getElementById('panel1').style.display='none'; document.getElementById('panel2').style.display='none'; document.getElementById('panel3').style.display='none'; document.getElementById('panel4').style.display=''; break } return false; }

Satyapriya Nayak · Answer

Hi Siva Try this... Untitled Page oncheckedchanged=RadioButton1_CheckedChanged /> oncheckedchanged=RadioButton2_CheckedChanged /> oncheckedchanged=RadioButton3_CheckedChanged /> oncheckedchanged=RadioButton4_CheckedChanged /> Panel1 Panel2 Panel3 Panel4 using System; using System.Collections; using System.Configuration; using System.Data; using System.Linq; using System.Web; using System.Web.Security; using System.Web.UI; using System.Web.UI.HtmlControls; using System.Web.UI.WebControls; using System.Web.UI.WebControls.WebParts; using System.Xml.Linq; namespace WebApplication13 { public partial class WebForm4 : System.Web.UI.Page { protected void Page_Load(object sender EventArgs e) { Panel1.Visible = false; Panel2.Visible = false; Panel3.Visible = false; Panel4.Visible = false; } protected void RadioButton1_CheckedChanged(object sender EventArgs e) { if(RadioButton1.Checked==true) { Panel1.Visible=true; } RadioButton2.Checked = false; RadioButton3.Checked = false; RadioButton4.Checked = false; } protected void RadioButton2_CheckedChanged(object sender EventArgs e) { if (RadioButton2.Checked == true) { Panel2.Visible = true; } RadioButton1.Checked = false; RadioButton3.Checked = false; RadioButton4.Checked = false; } protected void RadioButton3_CheckedChanged(object sender EventArgs e) { if (RadioButton3.Checked == true) { Panel3.Visible = true; } RadioButton1.Checked = false; RadioButton2.Checked = false; RadioButton4.Checked = false; } protected void RadioButton4_CheckedChanged(object sender EventArgs e) { if (RadioButton4.Checked == true) { Panel4.Visible = true; } RadioButton1.Checked = false; RadioButton2.Checked = false; RadioButton3.Checked = false; } } } Thanks