Show and hide of div
1
2
3
<%@ Page Language="C#" AutoEventWireup="true" CodeFile="General.aspx.cs" Inherits="General" %>
4
5<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
6
7<html xmlns="http://www.w3.org/1999/xhtml" >
8<head runat="server">
9 <title>Untitled Page</title>
10 <script type="text/javascript">
11
function DisplayCategoryDiv()
12
{
13 var Dv = document.getElementById("DvCategory");
14 var Btn = document.getElementById("<%= BtnDiv.ClientID %>");
15 if (Dv.style.display == '')
16 {
17 Btn.value = "show";
18 Dv.style.display = 'none';
19
}
20 else
21 {
22 Dv.style.display = '';
23 Btn.value = "hide";
24 }
25 return false;
26 }
27
</script>
28</head>
29<body>
30 <form id="form1" runat="server">
31 <div>
32 <table Width="100%">
33 <tr>
34 <td width="25%"></td>
35 <td width="75%"><asp:Button ID="BtnDiv" runat="server" Text=" Hide " Visible="true" OnClientClick="return DisplayCategoryDiv()" /></td>
36 </tr>
37 <tr>
38 <td width="25%"></td>
39 <td width="75%">
40 <div id="DvCategory" style="width:200;height:90;overflow-y:scroll;overflow-x:hidden;border-style:groove;position:absolute;background-color:yellow;">
41 <table width="200" border="0" cellpadding="0" cellspacing="0">
42 <tr>
43 <td>Category I</td>
44 </tr>
45 <tr>
46 <td>Category II</td>
47 </tr>
48 <tr>
49 <td>Category III</td>
50 </tr>
51 <tr>
52 <td>Category IV</td>
53 </tr>
54 </table>
55 </div>
56 </td>
57 </tr>
58 </table>
59 </div>
60 </form>
61</body>
62</html>
63
64
2
3
<%@ Page Language="C#" AutoEventWireup="true" CodeFile="General.aspx.cs" Inherits="General" %>
4
5
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">6
7
<html xmlns="http://www.w3.org/1999/xhtml" >8
<head runat="server">9
<title>Untitled Page</title>10
<script type="text/javascript">11
function DisplayCategoryDiv()12
{
13
var Dv = document.getElementById("DvCategory");14
var Btn = document.getElementById("<%= BtnDiv.ClientID %>");15
if (Dv.style.display == '')16
{17
Btn.value = "show";18
Dv.style.display = 'none';19
}20
else21
{22
Dv.style.display = '';23
Btn.value = "hide";24
}25
return false;26
}27
</script>28
</head>29
<body>30
<form id="form1" runat="server">31
<div>32
<table Width="100%">33
<tr>34
<td width="25%"></td>35
<td width="75%"><asp:Button ID="BtnDiv" runat="server" Text=" Hide " Visible="true" OnClientClick="return DisplayCategoryDiv()" /></td>36
</tr> 37
<tr>38
<td width="25%"></td>39
<td width="75%"> 40
<div id="DvCategory" style="width:200;height:90;overflow-y:scroll;overflow-x:hidden;border-style:groove;position:absolute;background-color:yellow;">41
<table width="200" border="0" cellpadding="0" cellspacing="0">42
<tr>43
<td>Category I</td>44
</tr>45
<tr>46
<td>Category II</td>47
</tr>48
<tr>49
<td>Category III</td>50
</tr>51
<tr>52
<td>Category IV</td>53
</tr>54
</table>55
</div>56
</td>57
</tr>58
</table>59
</div>60
</form>61
</body>62
</html>63
64
