TextBoxWatermarkExtender WatermarkCssClass覆盖的TextBox的CssClass [英] TextBoxWatermarkExtender WatermarkCssClass overwrites TextBox CssClass

问题描述

如果您设置与CssClass属性TextBox控件一个CSS类，瞄准与一个具有WatermarkCssClass属性将导致其失去其CSS类，即TextBoxWatermarkExtender的文本框，它是在CH375复位类属性的水印文本，而不是将其添加为额外的类：

 ＆LT; ASP：文本框ID =TextBox1的=服务器的CssClass =TEXT/＆GT;
＆LT; AJAX：TextBoxWatermarkExtender ID =TextBoxWatermarkExtender1=服务器的TargetControlID =TextBox1的WatermarkCssClass =水印/＆GT;
 

作为输出

 ＆LT;输入类型=文本级=TEXT/＆GT;
 

变为

 ＆LT;输入类型=文本级=水印/＆GT;
 

当水印样式生效，而不是

 ＆LT;输入类型=文本级=文字水印/＆GT;
 

任何人都可以提出解决办法：

请不要建议下面的解决方法，因为我有一个要求添加的TextBox的CssClass运行时间。我加入的TextBox的CssClass由JavaScript但仍TextBoxWatermarkExtender WatermarkCssClass覆盖文本框类。

设置WatermarkCssClass财产，包括两个类：

 ＆LT; ASP：文本框ID =TextBox1的=服务器的CssClass =TEXT/＆GT;
＆LT; AJAX：TextBoxWatermarkExtender ID =TextBoxWatermarkExtender1=服务器的TargetControlID =TextBox1的WatermarkCssClass =文字水印/＆GT;
 

解决方案

我看着一个由asp.net AJAX发出和这里的WaterMarkExtender是如何创建的JS。

  Sys.Application.add_init（函数（）{
$创建（Sys.Extended.UI.TextBoxWatermarkBehavior， {\"ClientStateFieldID\":\"TextBoxWatermarkExtender1_ClientState\",\"WatermarkCssClass\":\"watermark\",\"WatermarkText\":\"Hello\",\"id\":\"TextBoxWatermarkExtender1\"}, NULL，NULL，$的get（TextBox1中））;
}）
 

所以，我认为你可以申请init事件之后修改类的结核病。

 ＆LT;脚本类型=文/ JavaScript的＆GT;
     Sys.Application.add_load（appl_load）; //注册加载处理
     //加载处理
     功能appl_load（）{
            $（＃TextBox1中）addClass（文本）。
     }
＆LT; / SCRIPT＆GT;
 

参考： ASP.NET AJAX生命周期

通用...可能是你可以尝试寻找使用的.class或输入输入。这取决于整体的UI，因为你在你的问题，你在运行时添加的CssClass到TextBox提及。
我能想到的另一种方式是做反向，即让所有有水印类的输入，然后添加文本类。

 ＆LT;脚本类型=文/ JavaScript的＆GT;
         Sys.Application.add_load（appl_load）; //注册加载处理
         //加载处理
         功能appl_load（）{
                $（水印）addClass（文本）。
         }
    ＆LT; / SCRIPT＆GT;
 

If you set a CSS class on a TextBox control with the CssClass property, targeting that TextBox with the TextBoxWatermarkExtender that has a WatermarkCssClass property will cause it to lose its CSS class, i.e., it is reseting the class attribute to the watermark text, rather than adding it as an additional class:

<asp:TextBox ID="TextBox1" runat="server" CssClass="text" />
<ajax:TextBoxWatermarkExtender ID="TextBoxWatermarkExtender1" runat="server" TargetControlID="TextBox1" WatermarkCssClass="watermark" />

as an output

<input type="text" class="text" />

becomes

<input type="text" class="watermark" />

when the watermark style is in effect rather than

<input type="text" class="text watermark" />

Can anyone suggest the workaround?

Please do not suggest below the workaround because I have a requirement to add TextBox CssClass run time. I have added TextBox CssClass by javascript but still TextBoxWatermarkExtender WatermarkCssClass overwrites the textbox classes.

Set the WatermarkCssClass property to include both classes:

<asp:TextBox ID="TextBox1" runat="server" CssClass="text" />
<ajax:TextBoxWatermarkExtender ID="TextBoxWatermarkExtender1" runat="server" TargetControlID="TextBox1" WatermarkCssClass="text watermark" />

解决方案

I looked into the JS that is emitted by the asp.net ajax and here's how the WaterMarkExtender is created.

Sys.Application.add_init(function() {
$create(Sys.Extended.UI.TextBoxWatermarkBehavior, {"ClientStateFieldID":"TextBoxWatermarkExtender1_ClientState","WatermarkCssClass":"watermark","WatermarkText":"Hello","id":"TextBoxWatermarkExtender1"}, null, null, $get("TextBox1"));
})

So I think you can modify the class of the tb after application init event.

<script type="text/javascript">
     Sys.Application.add_load(appl_load); //register load handler
     //load handler
     function appl_load() {
            $("#TextBox1").addClass("text");
     }
</script>

Ref: ASP.NET Ajax life cycle

Generic... may be you can try finding the input using ".class" or "input". It depends on overall UI because you mentioned in your question that you add CssClass to the Textbox at runtime. One other way I can think of is doing the reverse i.e. get all the inputs that has watermark class and then add the text class.

 <script type="text/javascript">
         Sys.Application.add_load(appl_load); //register load handler
         //load handler
         function appl_load() {
                $(".watermark").addClass("text");
         }
    </script>

这篇关于TextBoxWatermarkExtender WatermarkCssClass覆盖的TextBox的CssClass的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！