ASP.net服务器控件:如何处理动态控件的ID

时间:2009-04-07 12:50:17

标签: asp.net controls

  

可能重复:
  .Net Changes the element IDs

我有以下问题(我会解释它简化,否则会变得太复杂/太长)。

我需要创建一个从Panel继承的ASP.net服务器控件。很简单。当自定义控件呈现时,它应该动态创建一个Button,将一个事件处理程序与它相关联(它也将在服务器控件中定义),并将此按钮添加到呈现的控件中。在服务器控件中定义的单击事件处理程序执行一些暂时不感兴趣的工作。

我已经编写了一个示例,并且工作正常。在服务器控件的构造函数中,我创建一个新的按钮控件,给它一个ID,关联一个事件处理程序,在服务器控件的OnInit上我将按钮添加到Panel控件(记住,我的控件继承自Panel)然后一切都得到渲染。这看起来如下所示:

public class MyCustomControl: Panel
    {
        private Button myButton;

        public MyCustomControl()
        {
            myButton = new Button();
            myButton.ID = "btnTest";
            myButton.Click += new EventHandler(btnTest_Click);
        }

        protected void btnTest_Click(object sender, EventArgs e)
        {
            //do something...
        }

        //...

        protected override void OnInit(EventArgs e)
        {
            base.OnInit(e);

            this.Controls.AddAt(0, myButton);
        }

        protected override void OnLoad(EventArgs e)
        {
            base.OnLoad(e);
            //...
        }

        protected override void OnPreRender(EventArgs e)
        {
            base.OnPreRender(e);
        }


        protected override void Render(HtmlTextWriter output)
        {
            base.RenderContents(output);
        }
    }

这很好用。该按钮被正确呈现,当我单击它时,将调用并执行此客户服务器控件中的相应处理程序。现在问题就出现了,当我想将这个服务器控件的多个实例添加到我的页面时,因为我生成的所有按钮都具有相同的id“btnTest”,这会导致冲突。所以我尝试将随机数与按钮的id相关联,s.t。它最终成为“btnTest1235512”或类似的东西。这解决了我使用多个ID的问题,但是导致了点击按钮时我的事件处理程序不再被正确调用的问题。我想这是由于我的按钮在输入构造函数时总是获得另一个id的问题,因此找不到合适的回调(btnTest_Click事件处理程序)。

有人可以给我一个如何处理问题的建议。有没有办法记住按钮的ID并重新关联它。据我所知,这必须发生在OnInit上,其中ViewState尚不可用。因此,将id存储在ViewState中是行不通的。

有什么建议吗?

3 个答案:

答案 0 :(得分:5)

实施INamingContainer应解决问题。然后,您可以继续命名所有按钮btnTest

这只是一个标记界面,因此您不必实现任何方法或属性。

答案 1 :(得分:0)

从INamingContainer继承,如:

public class MyCustomControl : Panel, INamingContainer
{
}

这是一个标记界面,不需要实现。我刚刚验证了您的代码,它解决了您的问题。

答案 2 :(得分:0)

实现INamingContainer将为您完成。它会自动为具有唯一ID的按钮命名。请注意,如果您需要在任何JavaScript中使用任何这些按钮,则需要使用ClientID属性:

function getButton() {
  var myButton = document.getElementById('<%=btnTest.ClientID %>');
}