Ext.NET (Coolite) 在 Tabpanel 中动态创建选项卡侦听器找不到 HTMLEditor 的 ID(对象未定义)

发布于 2024-10-01 08:33:42 字数 6935 浏览 4 评论 0原文

我在我的 aspx 文件上创建了一个 TabPanel。在我的代码后面,我动态创建:其中的选项卡以及每个选项卡中的 HtmlEditor。我还在每个选项卡上创建一个侦听器,以便当它们被激活或显示时,该选项卡中的 HtmlEditor 获得焦点。

当我执行该程序时,我看到该选项卡已在我的 TabPanel 上创建。但在网页准备使用之前,会出现错误,提示侦听器中的对象 Id 未定义。因此侦听器不起作用并且页面无法完全加载。

奇怪的是,如果我直接在我的 aspx 文件中添加一个选项卡,然后在选项卡面板中添加一个选项卡,并使用侦听器加载动态选项卡的其余部分:html 编辑器的所有 Id 都会被识别,并且所有侦听器都可以完美工作。除了第一个选项卡外,女巫没有侦听器,并且在本例中不是动态创建的。

我的理论是,TabPanel 索引 0 处的选项卡似乎在 HtmlEditor 控件的 ID 保存到页面之前启动了 Activate() 或 Show() 的侦听器。

所以我想知道我错过了什么,以及如何将侦听器(激活或显示)放置到 Tabpanel 中的每个选项卡上,以触发该选项卡内控件的焦点方法。当然,我想动态生成所有选项卡。

你能帮助我吗 ?

我希望我说得足够清楚。

这是我的 Default.aspx 页面:

<%@ 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>

这是我的 Default.aspx.cs 页面:

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);

    }
}

尝试修改已加载一个选项卡的 default.aspx 以及侦听器工作正常(但我当然不希望这样,因为我希望动态加载所有选项卡):

 <%@ 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>

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>

如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。

扫码二维码加入Web技术交流群

发布评论

需要 登录 才能够评论, 你可以免费 注册 一个本站的账号。
我们使用 Cookies 和其他技术来定制您的体验包括您的登录状态等。通过阅读我们的 隐私政策 了解更多相关信息。 单击 接受 或继续使用网站,即表示您同意使用 Cookies 和您的相关数据。
原文