I created a TabPanel on my aspx file. In my code behind, I dynamically create: the tabs inside it and also an HtmlEditor in each Tab. I also create a listener on each tab, so that when they get activated or show, the HtmlEditor in that tab get the focus.
When i execute the program, I see that the tab have been created on my TabPanel. But before the web page is ready to use, an error occur saying that the objects Id in the listeners is undefined. So the listener doesn't work and the page does not load completely.
The weird part, is that, if I add directly in my aspx file, a Tab in my Tab panel, and load the rest of my dynamic tab with listeners: All the Ids of the html editors are recognized, and all the listeners works perfectly. Except for the first tab, witch have no listener and was not created dynamically in this case.
My theory on that, is that the tab at the index 0 of a TabPanel seems to lauch the listener of Activate() or Show() before the ID of the HtmlEditor control is save to the page.
So I'm wondering what I missed and how can I put listeners (activate or show) to each tab in a Tabpanel that will trigger the focus method of a control inside that Tab. And of course I want to generate all my tab dynamically.
Can you help me ?
I hope I was clear enough.
Here's my Default.aspx page:
<%@ Page Language="C#" AutoEventWireup="true" CodeFile="Default.aspx.cs" Inherits="_Default" %>
<%@ Register Assembly="Coolite.Ext.Web" Namespace="Coolite.Ext.Web" TagPrefix="ext" %>
<script runat="server"> </script>
<!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 runat="server">
<title>Page sans titre</title>
</head>
<body runat="server">
<ext:ScriptManager ID="CooliteScriptManager" runat="server" QuickTips="true" ScriptAdapter="Ext">
</ext:ScriptManager>
<form id="form" runat = "server">
<ext:Panel ID="PnFiche" runat="server" Border="false" Header="false" Frame="false"
AutoScroll="true" BodyStyle="padding: 10px; text-align: left;">
<Body>
<ext:FormLayout ID="FormLayout1" runat="server" LabelWidth="150">
<ext:Anchor runat="server">
<ext:MultiField runat="server" FieldLabel="Indications / but de l'analyse" >
<Fields>
<ext:FormPanel runat="server" Title="Indications / but de l'analyse" Width="1000" Collapsible="true">
<Body>
<ext:TabPanel ID="TpIndications" runat="server" Width="1000" Height="250" EnableTabScroll="true">
</ext:TabPanel>
</Body>
</ext:FormPanel>
</Fields>
</ext:MultiField>
</ext:Anchor>
</ext:FormLayout>
</Body>
</ext:Panel>
</form>
</body>
</html>
Here's my Default.aspx.cs page:
using System;
using System.Configuration;
using System.Data;
using System.Linq;
using System.Web;
using System.Web.Security;
using System.Web.UI;
using System.Web.UI.HtmlControls;
using System.Web.UI.WebControls;
using System.Web.UI.WebControls.WebParts;
using System.Xml.Linq;
using Coolite.Ext.Web;
public partial class _Default : System.Web.UI.Page
{
protected void Page_Load(object sender, EventArgs e)
{
GenerateObjectTabPanel(TpIndications, "French", "Indication", null);
GenerateObjectTabPanel(TpIndications, "English", "Indication", null);
}
private void GenerateObjectTabPanel(TabPanel theTabPanel, String theLanguage, String suffixeID, String TextToReplace)
{
HtmlEditor TheHtmlEditor = new HtmlEditor();
TheHtmlEditor.ID = "Editeur_HTML_" + suffixeID + "_" + theLanguage;
TheHtmlEditor.Height = 250;
TheHtmlEditor.Width = 1000;
if (!string.IsNullOrEmpty(TextToReplace))
{
TheHtmlEditor.Text = TextToReplace;
}
Tab TheTab = new Tab("Tab_" + suffixeID + "_" + theLanguage, theLanguage);
TheTab.BodyControls.Add(TheHtmlEditor);
TheTab.Listeners.Activate.Handler = "#{" + TheHtmlEditor.ID + "}.focus();";
theTabPanel.Tabs.Add(TheTab);
}
}
Try modifying the default.aspx with one Tab already loaded and the listener works fine (But of course i don't want that since i want all my tab to be dynamically loaded):
<%@ Page Language="C#" AutoEventWireup="true" CodeFile="Default.aspx.cs" Inherits="_Default" %>
<%@ Register Assembly="Coolite.Ext.Web" Namespace="Coolite.Ext.Web" TagPrefix="ext" %>
<script runat="server"> </script>
<!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 runat="server">
<title>Page sans titre</title>
</head>
<body runat="server">
<ext:ScriptManager ID="CooliteScriptManager" runat="server" QuickTips="true" ScriptAdapter="Ext">
</ext:ScriptManager>
<form id="form" runat = "server">
<ext:Panel ID="PnFiche" runat="server" Border="false" Header="false" Frame="false"
AutoScroll="true" BodyStyle="padding: 10px; text-align: left;">
<Body>
<ext:FormLayout ID="FormLayout1" runat="server" LabelWidth="150">
<ext:Anchor runat="server">
<ext:MultiField runat="server" FieldLabel="Indications / but de l'analyse" >
<Fields>
<ext:FormPanel runat="server" Title="Indications / but de l'analyse" Width="1000" Collapsible="true">
<Body>
<ext:TabPanel ID="TpIndications" runat="server" Width="1000" Height="250" EnableTabScroll="true">
<Tabs>
<ext:Tab ID="TI_fr_CA" runat="server" Height="250" Width="1000" Title="test">
<Body>
<ext:HtmlEditor ID="EI_fr_CA" runat="server" Height="250" Width="1000" Visible="true">
</ext:HtmlEditor>
</Body>
</ext:Tab>
</Tabs>
</ext:TabPanel>
</Body>
</ext:FormPanel>
</Fields>
</ext:MultiField>
</ext:Anchor>
</ext:FormLayout>
</Body>
</ext:Panel>
</form>
</body>
</html>
