客户端验证在页面加载时不可见的用户控件

时间:2012-07-03 16:16:44

标签: c# asp.net validation

我创建了一个具有一些自定义客户端验证的用户控件。我通过RegisterStartupScript嵌入Javascript,并通过RegisterExpandoAttribute将信息传递给验证。但是,在PageLoad上看不到用户控件,当我使用document.getElementById时,我得到空值。

这是我目前的代码:

    public void Page_Load(object sender, EventArgs e) 
    { 
            ClientScriptManager cs = Page.ClientScript; 
            Type cstype = this.GetType(); 
            if (!cs.IsStartupScriptRegistered(cstype, "ValidatorType")) 
            { 
                String DateValidator; 
                DateValidator = "<script type=\"text/javascript\">\n"; 
                DateValidator += "function ValidateDate(source, args) {\n"; 
                DateValidator += "   var ddDay = document.getElementById(source.day);\n"; 
                DateValidator += "   var day = ddDay.selectedIndex;\n"; 
                DateValidator += "   var ddMonth = document.getElementById(source.month);\n"; 
                DateValidator += "   var month = ddMonth.selectedIndex;\n"; 
                DateValidator += "   var ddYear = document.getElementById(source.year);\n"; 
                DateValidator += "   var year = ddYear.selectedIndex;\n"; 
                DateValidator += "   if (day == 0 || month == 0 || year == 0)\n"; 
                DateValidator += "      args.IsValid = false;\n"; 
                DateValidator += "   else\n"; 
                DateValidator += "      args.IsValid = true;\n"; 
                DateValidator += "   }\n"; 
                DateValidator += "</script>"; 
                cs.RegisterStartupScript(cstype, "ValidatorType", DateValidator); 
            } 

            cs.RegisterExpandoAttribute(reqDueDate.ClientID, "month", ddMonth.ClientID); 
            cs.RegisterExpandoAttribute(reqDueDate.ClientID, "day", ddDay.ClientID, false); 
            cs.RegisterExpandoAttribute(reqDueDate.ClientID, "year", ddYear.ClientID, false); 
    }

我收到的错误是:

Uncaught TypeError: Cannot set property 'month' of null 
Uncaught TypeError: Cannot read property 'selectedIndex' of null 

2 个答案:

答案 0 :(得分:1)

服务器端不可见的控件不会出现在服务器生成的客户端上的html中。所以它应该是null。使用javascript使其隐藏隐藏,并在需要时使用javascript再次显示。

脚本应在渲染控件后执行。

隐藏客户端上的服务器控件

document.getElementById('<%= pnlMail.ClientID %>').style.display = 'none'; 

隐藏客户端上的HTML控件

document.getElementById('htmlControlID').style.display = 'none'; 

答案 1 :(得分:0)

更“服务器端”的方法是在服务器上设置值,然后你不依赖于javascript。 ASCX:

    <asp:TextBox runat="server" ID="uxToHide" />

代码隐藏:

    protected void Page_Load(object sender, EventArgs e)
    {
        uxToHide.Style.Add("display", "none");
    }

使用PlaceHolders会增加一些复杂性,但这并不算太糟糕。 ASCX:

    <asp:PlaceHolder ID="uxToHide" runat="server" />

代码隐藏:

    protected void Page_Load(object sender, EventArgs e)
    {
        TextBox tb = new TextBox();
        tb.Style["display"] = "none";
        uxToHide.Controls.Add(tb);

        ShowChildren(uxToHide);
    }

    public static void HideChildren(Control container)
    {
        if (container == null || container.Controls == null || container.Controls.Count == 0)
        {
            return;
        }
        foreach (Control c in container.Controls)
        {
            if (c is WebControl)
            {
                ((WebControl)c).Style["display"] = "none";
            }
            HideChildren(c);
        }
    }

    public static void ShowChildren(Control container)
    {
        if (container == null || container.Controls == null || container.Controls.Count == 0)
        {
            return;
        }
        foreach (Control c in container.Controls)
        {
            if (c is WebControl)
            {
                WebControl wc = (WebControl)c;
                if (wc.Style["display"] == "none")
                {
                    wc.Style.Remove("display");
                }
            }
            ShowChildren(c);
        }
    }