Водяной знак размещен на сервере при использовании DropdownList в UpdatePanel

Question

Если вы поместите текстовое поле с примененным к нему плагином jQuery.watermark и DropdownList, для которого AutoPostback установлено значение true в UpdatePanel, водяной знак не будет удален из текстового поля при изменении выпадающего списка.

Водяной знак из текстового поля публикуется на сервере как неверное значение текстового поля.Если вы не используете UpdatePanel, значение водяного знака корректно очищается с помощью кода отправки формы плагина.

Из того, что я могу понять, проблема заключается в том, что обратная передача, сгенерированная для DropdownList, полностью выполняется в JavaScript, минуяобработчики событий отправки формы, которые плагин будет очищать значение водяного знака.Различные события ASP.NET AJAX JavaScript запускаются после того, как тело поста было построено, поэтому я не могу использовать их для удаления водяного знака.Есть ли какой-то другой способ сделать это?

Это относится только к браузерам, которые не имеют встроенной поддержки атрибута заполнителя, особенно IE9 и ниже.

У меня поднял этов качестве ошибки для плагина здесь .

Код для воспроизведения этого:

    <form id="form1" runat="server">
    <asp:ScriptManager runat="server" />
    <div>
        Demonstration. 
        <br />
        <br />
        Note: This is only a problem for browsers that do not have have text field placeholder support. Most notabily Internet Explorer 9 and below.
        <ol>
            <li>The text field has a watermark 'wattery' applied to it</li>
            <li>The dropdown list is set to auto postback</li>
            <li>When you change the dropdown list the watermark is not removed and is posted to the server as the value of the text field</li>
            <li>When you click either the button or the link the watermark is removed as these actions trigger the 'beforeunload' event.</li>
        </ol>
        <asp:UpdatePanel runat="server">
            <ContentTemplate>
                <asp:TextBox runat="server" ID="txt" />
                <asp:DropDownList runat="server" ID="ddl" AutoPostBack="true" 
                    onselectedindexchanged="ddl_SelectedIndexChanged">
                    <asp:ListItem Text="one" />
                    <asp:ListItem Text="two" />
                </asp:DropDownList>
                <asp:Button Text="Click me 1" runat="server" />
                <asp:LinkButton Text="Click me 2" runat="server" />
                <br />
                <br />

                Value from text field after postback = '<asp:Label Text="" runat="server" ID="lbl" />'
            </ContentTemplate>
        </asp:UpdatePanel>
    </div>
    </form>

    <script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.js" ></script>
    <script type="text/javascript" src="js/jquery.watermark.js" ></script>
    <script type="text/javascript">

        $().ready(function () {
            $('#<%=txt.ClientID %>').watermark("wattery");
        });

    </script>

protected void ddl_SelectedIndexChanged(object sender, EventArgs e)
{
    lbl.Text = txt.Text;
}

Answer 1

Довольно старая тема, но недавно эта проблема возникла. Вот кое-что, что я придумал.

$('#<%=Button1.ClientID%>').click(function () { 
                if (typeof("Page_ClientValidate") === "function") {
                    if (Page_ClientValidate()) {
                        $.watermark.hideAll();
                    }
                    else {
                        $.watermark.showAll();
                    }
                }
                else { $.watermark.hideAll(); }
});

Примечание: не проверено на 100%, но что-то в этом направлении должно работать.