Question

我制作了一个继承自文本框的自定义文本框。

    using System.Drawing;
    using System;
    using System.Collections.Generic;
    using System.ComponentModel;
    using System.Linq;
    using System.Text;
    using System.Web;
    using System.Web.UI;
    using System.Web.UI.WebControls;

    namespace GNB.DPS.MVAD.CustomWebControls
    {
        [Designer("GNB.DPS.MVAD.CustomWebControls.MVADTextBox, GNB.DPS.MVAD.CustomWebControls"), DefaultProperty("Text"), ToolboxData("<{0}:MVADTextBox runat=server></{0}:MVADTextBox>")]
        public class MVADTextBox : TextBox
        {
            public virtual string SampleText
            {
                get
                {
                    string s = (string)ViewState["SampleText"];
                    return s ?? String.Empty;
                }
                set
                {
                    ViewState["SampleText"] = value;
                }
            }

            [Bindable(false)]
            [Category("Properties")]
            [DefaultValue("")]
            [Localizable(true)]
            public string Mask
            {
                get
                {
                    String tblName = (String)ViewState["Mask"];
                    return (Mask ?? String.Empty);
                }

                set
                {
                    ViewState["Mask"] = value;
                }
            }

            protected override void OnLoad(EventArgs e)
            {
                if(!Page.IsPostBack)
                {
                    if(Text == String.Empty)
                    {
                        if (SampleText != "")
                        {
                            CssClass = "sampleText";
                            this.Text = SampleText;
                            var onFocus = "<script language=\"javascript\">function ClearField(input) { if(input.value == input.defaultValue){input.value = \"\"; input.className = 'regularText';} } </script>";
                            var onBlur = "<script language=\"javascript\"> function PopulateField(input) {if (input.value == \"\") {input.value = input.defaultValue; input.className = 'sampleText'; } } </script>";

                            Page.ClientScript.RegisterClientScriptBlock(this.GetType(), "OnFocus", onFocus);
                            this.Attributes.Add("onfocus", "ClearField(this);");

                            Page.ClientScript.RegisterClientScriptBlock(this.GetType(), "OnBlur", onBlur);
                            this.Attributes.Add("onblur", "PopulateField(this);");
                        }
                    }
                }
            }
        }
    }

在.aspx上可以这样使用......

<script language="javascript">
    function MaskInput(input) {
        var textbox = document.getElementById(input.id);
        var mask = textbox.getAttribute('Mask');

    } 
</script>

    <MVAD:MVADTextBox ID="tbMVAD2" runat="server" SampleText="Hello" Mask="###-###" onKeyPress="MaskInput(this);" />

然而......这一行返回null var mask = textbox.getAttribute（'Mask'）;

在视图来源中我们看到......

<input name="ctl00$cphListBody$tbMVAD2" type="text" value="Hello" id="ctl00_cphListBody_tbMVAD2" class="sampleText" onKeyPress="MaskInput(this);" onfocus="ClearField(this);" onblur="PopulateField(this);" />

注意源名称Mask或Sample Text中没有属性。因此我无法通过javascript访问该属性。我的控件设置正确吗？任何想法？

Answer 1

我认为你在客户端和服务器端之间存在很大的混淆。 “Mask”属性仅在.NET（服务器端）上，您尝试从javascript（客户端）读取它。不会呈现“mask”属性。您可以修改“OnLoad”方法来添加它，或者只是按照Gabriel的回答建议在事件上传递属性。

protected override void OnLoad(EventArgs e)
{
    if(!Page.IsPostBack)
         {
             if(Text == String.Empty)
             {
                 if (SampleText != "")
                 {
                            CssClass = "sampleText";
                            this.Text = SampleText;
                            var onFocus = "<script language=\"javascript\">function ClearField(input) { if(input.value == input.defaultValue){input.value = \"\"; input.className = 'regularText';} } </script>";
                            var onBlur = "<script language=\"javascript\"> function PopulateField(input) {if (input.value == \"\") {input.value = input.defaultValue; input.className = 'sampleText'; } } </script>";

                            Page.ClientScript.RegisterClientScriptBlock(this.GetType(), "OnFocus", onFocus);
                            this.Attributes.Add("onfocus", "ClearField(this);");

                            Page.ClientScript.RegisterClientScriptBlock(this.GetType(), "OnBlur", onBlur);
                            this.Attributes.Add("onblur", "PopulateField(this);");

                            this.Attributes.Add("Mask", this.Mask);
                        }
                    }
                }
            }

修改

public string Mask { get { String tblName = (String)ViewState["Mask"]; return (Mask ?? String.Empty); // This is causing your stack overflow... } }

Answer 2

将你的面具放在这样的函数中：

<script language="javascript">
    function MaskInput(input, mask) {
        var textbox = document.getElementById(input.id);
    } 
</script>

    <MVAD:MVADTextBox ID="tbMVAD2" runat="server" SampleText="Hello" onKeyPress="MaskInput(this, '###-###');" />

构建视图时，您的自定义属性会被asp.net应用程序忽略。

无法通过javascript访问自定义文本框属性

2 个答案: