Hide/Show Div when selecting radio button
-
Hi I have two div in my web page and two radio button I want initially both div will be invisible.When i am selecting one radio button i want one div will be visible and other will be invisible I am using IE-7 please help me
-
Hi I have two div in my web page and two radio button I want initially both div will be invisible.When i am selecting one radio button i want one div will be visible and other will be invisible I am using IE-7 please help me
u can use javascrpit function for this like: function showdiv1() { document.getElementById('div1').style.display='block'; // to display document.getElementById('div2').style.display='none'; // to hide } and make similar function for div2 and call them on selection of radiobutton.
-
u can use javascrpit function for this like: function showdiv1() { document.getElementById('div1').style.display='block'; // to display document.getElementById('div2').style.display='none'; // to hide } and make similar function for div2 and call them on selection of radiobutton.
I tried it but it is not working
-
I tried it but it is not working
try the ajax accordian pane thats the real fast way to do it in asp and also you can find it on google or codeplex for this third party dll and the functions working can be seen on asp.net/samples.If you want more then these are deeply described in wrox asp.net prof. buy the book. byee, cheers
-
I tried it but it is not working
-
Hi I have two div in my web page and two radio button I want initially both div will be invisible.When i am selecting one radio button i want one div will be visible and other will be invisible I am using IE-7 please help me
You can do it just using JavaScript. Download jQuery 1.3.2[^] and test the code below.
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> <html> <head> <title>DIV show / hide example</title> <script type="text/javascript" src="jquery-1.3.2.min.js"></script> <script type="text/javascript"> $(document).ready(function() { $('#box_dv div').each(function() { $(this).hide(); }); $('#box_rdo input:radio').each(function() { $(this).click(function() { $('#box_dv div').hide(); $('#' + $(this).attr('value')).show(); }); }) }); </script> </head> <body> <div> <div id="box_rdo"> <input type="radio" id="r1" name="rdo" value="d1" /><label for="r1">DIV 1</label> <input type="radio" id="r2" name="rdo" value="d2" /><label for="r2">DIV 2</label> </div> <br /> <div id="box_dv"> <div id="d1"> <h1>DIV 1</h1> This is the DIV 1 content! </div> <div id="d2"> <h1>DIV 2</h1> This is the DIV 2 content! </div> </div> </div> </body> </html>If you gonna use asp.net server controls, instead of <input type="radio"> and <div> use asp:RadioButtonList and asp:Panel... Handle the OnSelectedIndexChanged event of the radio button list to manipulate the visibility of the asp:panel's (div's).modified on Monday, April 6, 2009 12:47 PM
-
Hi I have two div in my web page and two radio button I want initially both div will be invisible.When i am selecting one radio button i want one div will be visible and other will be invisible I am using IE-7 please help me
The sample javascript is below. function showdiv() { //To hide div document.getElementById("DIV").style.display='none'; //To show div document.getElementById("DIV").style.display='block'; } .... ....
.... ....
..... Use this in your code as per your requirement and this should definitely help you out.
-
Hi I have two div in my web page and two radio button I want initially both div will be invisible.When i am selecting one radio button i want one div will be visible and other will be invisible I am using IE-7 please help me
Make both the divs runat='server' and assign them some ID
and write your code according to that. e.g. on Page_Load if u want to both the divs invisible then : div1.Visible= false; div2.Visible= false; Similarly you can write code according to the radio button selection.
Happy Coding, Vivek Rathore