naeema
May 12th, 2004, 02:22 AM
Hi,
I am new on ASP.NET programming. I got stuck on a very simple thing.
I am trying to develop a web application which consists of multiple tabs and I want certain fields and button in different tabs.
If I put the button inside the TAB and execute the application, the button_click event is not called. But if I put it outside the TAB means at Global level its button_click event is executed.
Can somebody tell me If there is some special way to activate the button_click handler in C# code, if the button is inside the DIV paragraph.
I am attaching the HTML file for the reference.
Thanks in advance.
<%@ Register TagPrefix="cr" Namespace="CrystalDecisions.Web" Assembly="CrystalDecisions.Web, Version=9.1.3300.0, Culture=neutral, PublicKeyToken=692fbea5521e1304" %>
<%@ Page language="c#" Codebehind="mapcsharp.aspx.cs" AutoEventWireup="false" Inherits="mapcsharp.WebForm1" aspCompat="True"%>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN" >
<HTML>
<HEAD>
<title>Kivera Location Service Application</title>
<meta content="False" name="vs_showGrid">
<meta content="Microsoft Visual Studio 7.0" name="GENERATOR">
<meta content="C#" name="CODE_LANGUAGE">
<meta content="JavaScript" name="vs_defaultClientScript">
<meta content="http://schemas.microsoft.com/intellisense/ie5" name="vs_targetSchema">
<STYLE dir="ltr" language="C#">
.conts { VISIBILITY: hidden }
.tab { BORDER-RIGHT: gray thin solid; BORDER-TOP: #e0e0e0 thin solid; FONT-WEIGHT: normal; FONT-SIZE: 10pt; BORDER-LEFT: #e0e0e0 thin solid; FONT-FAMILY: Verdana; TEXT-ALIGN: center }
.selTab { BORDER-RIGHT: black thin solid; BORDER-TOP: white thin solid; FONT-WEIGHT: bold; BORDER-LEFT: white thin solid; TEXT-ALIGN: center }
</STYLE>
<SCRIPT LANGUAGE="JavaScript">
//a public function that the container uses to pass in values for the labels
function public_Labels(label1, label2, label3, label4, label5, label6, label7){
t1.innerText = label1;
t2.innerText = label2;
t3.innerText = label3;
t4.innerText = label4;
t5.innerText = label5;
t6.innerText = label6;
t7.innerText = label7;
}
//a public function that the container uses to pass in values for the card containers
function public_Contents(contents1, contents2, contents3, contents4, contents5, contents6, contents7){
t1Contents.innerHTML = contents1;
t2Contents.innerHTML = contents2;
t3Contents.innerHTML = contents3;
t4Contents.innerHTML = contents4;
t5Contents.innerHTML = contents5;
t6Contents.innerHTML = contents6;
t7Contents.innerHTML = contents7;
init();
}
//sets the default display to tab 1
function init(){
tabContents.innerHTML = t1Contents.innerHTML;
}
//this is the tab switching function
var currentTab;
var tabBase;
var firstFlag = true;
function changeTabs(){
if(firstFlag == true){
currentTab = t1;
tabBase = t1base;
firstFlag = false;
}
if(window.event.srcElement.className == "tab"){
currentTab.className = "tab";
tabBase.style.backgroundColor = "white";
currentTab = window.event.srcElement;
tabBaseID = currentTab.id + "base";
tabContentID = currentTab.id + "Contents";
tabBase = document.all(tabBaseID);
tabContent = document.all(tabContentID);
currentTab.className = "selTab";
tabBase.style.backgroundColor = "";
tabContents.innerHTML = tabContent.innerHTML;
}
}
</SCRIPT>
</HEAD>
<BODY BGCOLOR="#c0c0c0" onclick="changeTabs()" onload="init()" ms_positioning="GridLayout">
<DIV STYLE="BORDER-RIGHT:gray thin; BORDER-TOP:gray thin; BORDER-LEFT:gray thin; WIDTH:853px; BORDER-BOTTOM:gray thin; HEIGHT:731px">
<TABLE STYLE="WIDTH:100%; HEIGHT:750px" CELLPADDING="0" CELLSPACING="0" title="Kivera Location Application" align="center">
<TR>
<TD ID="t1" CLASS="selTab" HEIGHT="25">Geocode</TD>
<TD ID="t2" CLASS="tab">Reverse Geocode</TD>
<TD ID="t3" CLASS="tab">Driving Directions</TD>
<TD ID="t4" CLASS="tab">POIs</TD>
<TD ID="t5" CLASS="tab">Traffic</TD>
<TD ID="t6" CLASS="tab">PolyLine</TD>
<TD ID="t7" CLASS="tab">Component Geocode</TD>
</TR>
<TR>
<TD ID="t1base" STYLE="BORDER-LEFT:white thin solid; HEIGHT:2px"></TD>
<TD ID="t2base" STYLE="HEIGHT:2px; BACKGROUND-COLOR:white"></TD>
<TD ID="t3base" STYLE="HEIGHT:2px; BACKGROUND-COLOR:white"></TD>
<TD ID="t4base" STYLE="HEIGHT:2px; BACKGROUND-COLOR:white"></TD>
<TD ID="t5base" STYLE="HEIGHT:2px; BACKGROUND-COLOR:white"></TD>
<TD ID="t6base" STYLE="HEIGHT:2px; BACKGROUND-COLOR:white"></TD>
<TD ID="t7base" STYLE="BORDER-RIGHT:white thin solid; HEIGHT:2px; BACKGROUND-COLOR:white"></TD>
</TR>
<TR>
<TD HEIGHT="*" COLSPAN="7" ID="tabContents" STYLE=" BORDER-RIGHT:white thin solid; BORDER-LEFT:white thin solid; BORDER-BOTTOM:white thin solid" title="Kivera Location Application">sample
contents</TD>
</TR>
</TABLE>
</DIV>
<form id="Form1" method="post" runat="server">
<DIV CLASS="conts" ID="t1Contents" align="center">
<asp:button id="map" style="Z-INDEX: 113; LEFT: 663px; POSITION: absolute; TOP: 150px" runat="server" Width="96px" Height="27px" Text="Map" ForeColor="Black"></asp:button>
<asp:textbox id="line1" style="Z-INDEX: 101; LEFT: 617px; POSITION: absolute; TOP: 72px" runat="server" Height="24px" Width="194">1370 3rd Street</asp:textbox>
<asp:label id="Label8" style="Z-INDEX: 104; LEFT: 621px; POSITION: absolute; TOP: 239px" runat="server" Width="117px" Height="16px">City, State Or Zip</asp:label>
<asp:textbox id="line2" style="Z-INDEX: 117; LEFT: 617px; POSITION: absolute; TOP: 117px" runat="server" Width="194px" Height="24px">Alameda, CA 94501</asp:textbox>
<asp:label id="Label9" style="Z-INDEX: 109; LEFT: 743px; POSITION: absolute; TOP: 331px" runat="server" Width="47px" Height="17px" Font-Bold="True">Latitude</asp:label>
<asp:label id="Label10" style="Z-INDEX: 111; LEFT: 629px; POSITION: absolute; TOP: 331px" runat="server" Width="61px" Height="12px" Font-Bold="True">Longitude</asp:label>
<asp:textbox id="longitude" style="Z-INDEX: 114; LEFT: 620px; POSITION: absolute; TOP: 353px" runat="server" Width="93px" Height="28px"></asp:textbox>
<asp:textbox id="latitude" style="Z-INDEX: 116; LEFT: 720px; POSITION: absolute; TOP: 353px" runat="server" Width="93px" Height="28px"></asp:textbox>
</DIV>
</form>
</BODY>
</HTML>
I am new on ASP.NET programming. I got stuck on a very simple thing.
I am trying to develop a web application which consists of multiple tabs and I want certain fields and button in different tabs.
If I put the button inside the TAB and execute the application, the button_click event is not called. But if I put it outside the TAB means at Global level its button_click event is executed.
Can somebody tell me If there is some special way to activate the button_click handler in C# code, if the button is inside the DIV paragraph.
I am attaching the HTML file for the reference.
Thanks in advance.
<%@ Register TagPrefix="cr" Namespace="CrystalDecisions.Web" Assembly="CrystalDecisions.Web, Version=9.1.3300.0, Culture=neutral, PublicKeyToken=692fbea5521e1304" %>
<%@ Page language="c#" Codebehind="mapcsharp.aspx.cs" AutoEventWireup="false" Inherits="mapcsharp.WebForm1" aspCompat="True"%>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN" >
<HTML>
<HEAD>
<title>Kivera Location Service Application</title>
<meta content="False" name="vs_showGrid">
<meta content="Microsoft Visual Studio 7.0" name="GENERATOR">
<meta content="C#" name="CODE_LANGUAGE">
<meta content="JavaScript" name="vs_defaultClientScript">
<meta content="http://schemas.microsoft.com/intellisense/ie5" name="vs_targetSchema">
<STYLE dir="ltr" language="C#">
.conts { VISIBILITY: hidden }
.tab { BORDER-RIGHT: gray thin solid; BORDER-TOP: #e0e0e0 thin solid; FONT-WEIGHT: normal; FONT-SIZE: 10pt; BORDER-LEFT: #e0e0e0 thin solid; FONT-FAMILY: Verdana; TEXT-ALIGN: center }
.selTab { BORDER-RIGHT: black thin solid; BORDER-TOP: white thin solid; FONT-WEIGHT: bold; BORDER-LEFT: white thin solid; TEXT-ALIGN: center }
</STYLE>
<SCRIPT LANGUAGE="JavaScript">
//a public function that the container uses to pass in values for the labels
function public_Labels(label1, label2, label3, label4, label5, label6, label7){
t1.innerText = label1;
t2.innerText = label2;
t3.innerText = label3;
t4.innerText = label4;
t5.innerText = label5;
t6.innerText = label6;
t7.innerText = label7;
}
//a public function that the container uses to pass in values for the card containers
function public_Contents(contents1, contents2, contents3, contents4, contents5, contents6, contents7){
t1Contents.innerHTML = contents1;
t2Contents.innerHTML = contents2;
t3Contents.innerHTML = contents3;
t4Contents.innerHTML = contents4;
t5Contents.innerHTML = contents5;
t6Contents.innerHTML = contents6;
t7Contents.innerHTML = contents7;
init();
}
//sets the default display to tab 1
function init(){
tabContents.innerHTML = t1Contents.innerHTML;
}
//this is the tab switching function
var currentTab;
var tabBase;
var firstFlag = true;
function changeTabs(){
if(firstFlag == true){
currentTab = t1;
tabBase = t1base;
firstFlag = false;
}
if(window.event.srcElement.className == "tab"){
currentTab.className = "tab";
tabBase.style.backgroundColor = "white";
currentTab = window.event.srcElement;
tabBaseID = currentTab.id + "base";
tabContentID = currentTab.id + "Contents";
tabBase = document.all(tabBaseID);
tabContent = document.all(tabContentID);
currentTab.className = "selTab";
tabBase.style.backgroundColor = "";
tabContents.innerHTML = tabContent.innerHTML;
}
}
</SCRIPT>
</HEAD>
<BODY BGCOLOR="#c0c0c0" onclick="changeTabs()" onload="init()" ms_positioning="GridLayout">
<DIV STYLE="BORDER-RIGHT:gray thin; BORDER-TOP:gray thin; BORDER-LEFT:gray thin; WIDTH:853px; BORDER-BOTTOM:gray thin; HEIGHT:731px">
<TABLE STYLE="WIDTH:100%; HEIGHT:750px" CELLPADDING="0" CELLSPACING="0" title="Kivera Location Application" align="center">
<TR>
<TD ID="t1" CLASS="selTab" HEIGHT="25">Geocode</TD>
<TD ID="t2" CLASS="tab">Reverse Geocode</TD>
<TD ID="t3" CLASS="tab">Driving Directions</TD>
<TD ID="t4" CLASS="tab">POIs</TD>
<TD ID="t5" CLASS="tab">Traffic</TD>
<TD ID="t6" CLASS="tab">PolyLine</TD>
<TD ID="t7" CLASS="tab">Component Geocode</TD>
</TR>
<TR>
<TD ID="t1base" STYLE="BORDER-LEFT:white thin solid; HEIGHT:2px"></TD>
<TD ID="t2base" STYLE="HEIGHT:2px; BACKGROUND-COLOR:white"></TD>
<TD ID="t3base" STYLE="HEIGHT:2px; BACKGROUND-COLOR:white"></TD>
<TD ID="t4base" STYLE="HEIGHT:2px; BACKGROUND-COLOR:white"></TD>
<TD ID="t5base" STYLE="HEIGHT:2px; BACKGROUND-COLOR:white"></TD>
<TD ID="t6base" STYLE="HEIGHT:2px; BACKGROUND-COLOR:white"></TD>
<TD ID="t7base" STYLE="BORDER-RIGHT:white thin solid; HEIGHT:2px; BACKGROUND-COLOR:white"></TD>
</TR>
<TR>
<TD HEIGHT="*" COLSPAN="7" ID="tabContents" STYLE=" BORDER-RIGHT:white thin solid; BORDER-LEFT:white thin solid; BORDER-BOTTOM:white thin solid" title="Kivera Location Application">sample
contents</TD>
</TR>
</TABLE>
</DIV>
<form id="Form1" method="post" runat="server">
<DIV CLASS="conts" ID="t1Contents" align="center">
<asp:button id="map" style="Z-INDEX: 113; LEFT: 663px; POSITION: absolute; TOP: 150px" runat="server" Width="96px" Height="27px" Text="Map" ForeColor="Black"></asp:button>
<asp:textbox id="line1" style="Z-INDEX: 101; LEFT: 617px; POSITION: absolute; TOP: 72px" runat="server" Height="24px" Width="194">1370 3rd Street</asp:textbox>
<asp:label id="Label8" style="Z-INDEX: 104; LEFT: 621px; POSITION: absolute; TOP: 239px" runat="server" Width="117px" Height="16px">City, State Or Zip</asp:label>
<asp:textbox id="line2" style="Z-INDEX: 117; LEFT: 617px; POSITION: absolute; TOP: 117px" runat="server" Width="194px" Height="24px">Alameda, CA 94501</asp:textbox>
<asp:label id="Label9" style="Z-INDEX: 109; LEFT: 743px; POSITION: absolute; TOP: 331px" runat="server" Width="47px" Height="17px" Font-Bold="True">Latitude</asp:label>
<asp:label id="Label10" style="Z-INDEX: 111; LEFT: 629px; POSITION: absolute; TOP: 331px" runat="server" Width="61px" Height="12px" Font-Bold="True">Longitude</asp:label>
<asp:textbox id="longitude" style="Z-INDEX: 114; LEFT: 620px; POSITION: absolute; TOP: 353px" runat="server" Width="93px" Height="28px"></asp:textbox>
<asp:textbox id="latitude" style="Z-INDEX: 116; LEFT: 720px; POSITION: absolute; TOP: 353px" runat="server" Width="93px" Height="28px"></asp:textbox>
</DIV>
</form>
</BODY>
</HTML>