Hiding/Showing Div In Page Depending On Search Type

2011-04-16

Think about a scenario like this You have a master section like Country & an assosciated detailed section of the master such as States of the country you selected.
If you selected a country & then a button on it's click it should display the State & related details. And also From the States details you can view the Master.

Only 1 at a time after selection.

You can do it by displaying/hiding the Div tag of Master& Details section at the window load event of the HTML. So Make a javascript function & call this by registering to the Page by using
1
2
3
<span style="font-size: large;"><span style="color: #f1c232;"> </span></span>
 
Page.RegisterClientScriptBlock("OnLoadEvent", codeJavaScript);




Code Behind
---------------

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
using System;
 
using System.Collections.Generic;
 
using System.Linq;
 
using System.Web;
 
using System.Web.UI;
 
using System.Web.UI.WebControls;
 
 
 
namespace MinimizeMaximizeTab
 
{
 
public partial class HTMLTips : System.Web.UI.Page
 
{
 
protected void Page_Load(object sender, EventArgs e)
 
{
 
 
 
}
 
 
 
protected void btnShowDetails_Click(object sender, EventArgs e)
 
{
 
 
 
string codeJavaScript = "<script language=javascript>";
 
codeJavaScript += "window.onload = DisplayMaster;";
 
codeJavaScript += "function DisplayMaster()";
 
codeJavaScript += "{";
 
codeJavaScript += "document.getElementById('MasterDiv').style.visibility = 'hidden';";
 
codeJavaScript += "document.getElementById('DetailsDiv').style.visibility = 'visible';";
 
codeJavaScript += "}";
 
codeJavaScript += "</script>";
 
 
 
Page.RegisterClientScriptBlock("OnLoadEvent", codeJavaScript);
 
}
 
 
 
protected void btnShowMaster_Click(object sender, EventArgs e)
 
{
 
string codeJavaScript = "<script language=javascript>";
 
codeJavaScript += "window.onload = DisplayMaster;";
 
codeJavaScript += "function DisplayMaster()";
 
codeJavaScript += "{";
 
codeJavaScript += "document.getElementById('MasterDiv').style.visibility = 'visible';";
 
codeJavaScript += "document.getElementById('DetailsDiv').style.visibility = 'hidden';";
 
codeJavaScript += "}";
 
codeJavaScript += "</script>";
 
 
 
Page.RegisterClientScriptBlock("OnLoadEvent", codeJavaScript);
 
}
 
}
 
}

Works in following


0 comments: