panel hide and show with javascript

Posted by Bhuwan87rawat under JavaScript on 12/23/2012 | Points: 10 | Views : 7173 | Status : [Member] | Replies : 3
hello
in my application i want to hide and show panel with javascript when i select radiobutton list manu the open manu panel when i select quick radiobutton list then open
quick panel and also i select upload radiobutton list then open upload panel with javascript
radiobutton list possible in javascript ......





regard
bhuwan rawat




Responses

Posted by: Pavanandey on: 12/24/2012 [Member] Bronze | Points: 25

Up
0
Down
unction doHide()

{

document.getElementById("ctl00_ContentPlaceHolder1_pnlSearch").style.display = "none";

}

function doShow()

{

document.getElementById("ctl00_ContentPlaceHolder1_pnlSearch").style.display = "inline";

}

Thanks
Pavan Kumar
Mark Answer if this fits the need

Bhuwan87rawat, if this helps please login to Mark As Answer. | Alert Moderator

Posted by: Pavanandey on: 12/24/2012 [Member] Bronze | Points: 25

Up
0
Down
call these functions in radio button index changed

Thanks
Pavan Kumar
Mark Answer if this fits the need

Bhuwan87rawat, if this helps please login to Mark As Answer. | Alert Moderator

Posted by: Bhuwan87rawat on: 12/24/2012 [Member] Starter | Points: 25

Up
0
Down
<script type="text/javascript" language="javascript">
function ShowHide(rad) {


if (document.getElementById(rad.id + '_0').checked) {
alert("hi");
document.getElementById('Panel1').style.display = 'block';
document.getElementById('Panel2').style.display = 'none';
document.getElementById('Panel3').style.display = 'none';
}
else if (document.getElementById(rad.id + '_1').checked) {
alert("second");
document.getElementById('Panel2').style.display = 'block';
}
else {
alert("hello")
document.getElementById('Panel3').style.display = 'block';
document.getElementById('Panel2').style.display = 'none';
}
}
</script>
</head>
<body>
<form id="form1" runat="server">
<div>

<asp:RadioButtonList ID="RadioButtonList1" runat="server" class ="FontBig12"
RepeatDirection="Horizontal"
Height="30px" onclick="ShowHide(this)" RepeatLayout="Flow" >
<asp:ListItem Value="1">Quick Entry</asp:ListItem>
<asp:ListItem Value="2">Manual Entry</asp:ListItem>
<asp:ListItem Value="3">Upload</asp:ListItem>
</asp:RadioButtonList>
<%--<asp:RadioButtonList ID="RadioButtonList1" runat="server" RepeatDirection="Horizontal" onclick="ShowHide(this)" RepeatLayout="flow">
<asp:ListItem Value="true">Show</asp:ListItem>
<asp:ListItem Value="false">Hide</asp:ListItem>
</asp:RadioButtonList>--%>
<asp:Panel ID="Panel1" runat="server">
<asp:Label ID="Label1" runat="server">Asp panel content</asp:Label>

</asp:Panel>
<asp:panel id="panel2" runat="server">djfjkdjfkljdfjdj</asp:panel>
<asp:Panel ID="panel3" runat="server">this is third panel</asp:Panel></div>
</form>
</body>
</html>


Bhuwan87rawat, if this helps please login to Mark As Answer. | Alert Moderator

Login to post response