Hello Gurus,
I am using TabPanel which loads usercontrol dynamically,here UC3.ascx is not loading properly,I understand the javascript is not loading properly.
(UC3.ascx code,when used in seperate aspx page,it is working fine).Please help me with this.
<%@ Page Language="C#" AutoEventWireup="true" CodeFile="Default.aspx.cs" Inherits="Controls_Default" %>
<%@ Register Assembly="AjaxControlToolkit" Namespace="AjaxControlToolkit" TagPrefix="cc1" %>
<%@ Register Src="~/Controls/UC1.ascx" TagName="UC1" TagPrefix="UC1" %>
<%@ Register Src="~/Controls/UC2.ascx" TagName="UC2" TagPrefix="UC2" %>
<%@ Register Src="~/Controls/UC3.ascx" TagName="UC3" TagPrefix="UC3" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head id="Head1" runat="server">
<title></title>
</head>
<body>
<form id="form1" runat="server">
<div>
<asp:ScriptManager ID="sc1" runat="server" ></asp:ScriptManager>
<table>
<tr>
<td>
<asp:UpdatePanel ID="UpdatePanel1" runat="server">
<ContentTemplate>
<cc1:TabContainer ID="TabContainer1" runat="server" ActiveTabIndex="0" AutoPostBack="true">
<cc1:TabPanel ID="TabPanel1" runat="server">
<HeaderTemplate>Home</HeaderTemplate>
<ContentTemplate>
<asp:UpdatePanel ID="up1" runat="server">
<ContentTemplate>
<asp:Panel ID="panel1" runat="server">
<asp:Button ID="btn" runat="server" OnClick="btn_Click" Visible="false"/>
</asp:Panel>
</ContentTemplate>
<Triggers>
<asp:AsyncPostBackTrigger ControlID="btn" />
</Triggers>
</asp:UpdatePanel>
</ContentTemplate>
</cc1:TabPanel>
<cc1:TabPanel ID="TabPanel2" runat="server">
<HeaderTemplate>Contact</HeaderTemplate>
<ContentTemplate>
<asp:UpdatePanel ID="Up2" runat="server">
<ContentTemplate>
<asp:Panel ID="panel2" runat="server">
<asp:Button ID="btn2" runat="server" OnClick="btn_Click" Visible="false"/>
</asp:Panel>
</ContentTemplate>
<Triggers>
<asp:AsyncPostBackTrigger ControlID="btn2" />
</Triggers>
</asp:UpdatePanel>
</ContentTemplate>
</cc1:TabPanel>
<cc1:TabPanel ID="TabPanel3" runat="server">
<HeaderTemplate>Office Map</HeaderTemplate>
<ContentTemplate>
<asp:UpdatePanel ID="Up3" runat="server">
<ContentTemplate>
<asp:Panel ID="panel3" runat="server">
<asp:Button ID="btn3" runat="server" OnClick="btn_Click" Visible="false"/>
</asp:Panel>
</ContentTemplate>
<Triggers>
<asp:AsyncPostBackTrigger ControlID="btn3" />
</Triggers>
</asp:UpdatePanel>
</ContentTemplate>
</cc1:TabPanel>
</cc1:TabContainer>
</ContentTemplate>
</asp:UpdatePanel>
</td>
</tr>
</table>
</div>
<asp:HiddenField ID="hdnhome" runat="server" />
<asp:HiddenField ID="hdncon" runat="server" />
</form>
</body>
</html>
UC3.ascx
---------------
<%@ Control Language="C#" AutoEventWireup="true" CodeFile="UC3.ascx.cs" Inherits="Controls_UC3" %>
<%@ Register TagPrefix="telerik" Namespace="Telerik.Web.UI" Assembly="Telerik.Web.UI" %>
<script type="text/javascript" language="javascript">
function get_round(X) { return Math.round(X * 100) / 100 }
function showpay() {
if ((document.getElementById('loan').value == "") || (document.getElementById('months').value == "") || (document.getElementById('rate').value == "")) {
document.getElementById('pay').value = "Incomplete data";
document.getElementById('tot_amount').value = "Incomplete data";
document.getElementById('interest_pa').value = "Incomplete data";
document.getElementById('interest_pm').value = "Incomplete data";
document.getElementById('tot_interest').value = "Incomplete data";
document.getElementById('yearly_interest').value = "Incomplete data";
}
else {
var princ = document.getElementById('loan').value;
var term = document.getElementById('months').value;
var intr = document.getElementById('rate>').value / 1200;
var yrs = document.getElementById('months').value / 12;
document.getElementById('pay').value = get_round(princ * intr / (1 - (Math.pow(1 / (1 + intr), term))));
document.getElementById('tot_amount').value = get_round(document.getElementById('pay').value * term);
document.getElementById('tot_interest').value = get_round(document.getElementById('tot_amount').value / yrs);
document.getElementById('yearly_interest').value = get_round(document.getElementById('tot_interest').value / yrs);
document.getElementById('interest_pa').value = get_round(document.getElementById('yearly_interest').value / princ * 100);
document.getElementById('interest_pm').value = get_round((document.getElementById('yearly_interest').value / princ * 100) / 12);
}
}
</script>
<div id="Property_form">
<div>
<fieldset>
<h2>
EMI Calculator
</h2>
<table align="center">
<tr>
<td>
<asp:TextBox ID="loan" runat="server" Width="200px"></asp:TextBox>
</td>
</tr>
<tr>
<td>
<asp:TextBox ID="months" runat="server" Width="200px"></asp:TextBox>
</td>
</tr>
<tr>
<td>
<asp:TextBox ID="rate" runat="server" Width="200px" ></asp:TextBox>
</td>
<td>
%
</td>
</tr>
<tr>
<td>
<input type="button" id="button" name="button" value="Click" class="normallink" onclick="showpay()" />
</td>
</tr>
<tr>
<td>
<asp:TextBox ID="pay" runat="server" Width="200px" ></asp:TextBox>
</td>
</tr>
<tr>
<td>
<asp:TextBox ID="tot_amount" runat="server" Width="200px"></asp:TextBox>
</td>
</tr>
<tr>
<td>
<asp:TextBox ID="interest_pa" runat="server" Width="200px" ></asp:TextBox>
</td>
</tr>
<tr>
<td>
<asp:TextBox ID="interest_pm" runat="server" Width="200px"></asp:TextBox>
</td>
</tr>
<tr>
<td>
<asp:TextBox ID="tot_interest" runat="server" Width="200px"></asp:TextBox>
</td>
</tr>
<tr>
<td>
<asp:TextBox ID="yearly_interest" runat="server" Width="200px" ></asp:TextBox>
</td>
</tr>
</table>
</fieldset>
</div>
</div>