Плагин JQuery не работает

Question

У меня есть маска даты JQuery, но когда я запускаю страницу, она выдает ошибку «Ошибка выполнения Microsoft JScript: объект не поддерживает это свойство или метод».

Теперь элемент управления, для которого предназначен этот конкретный JQuery, динамически добавляется к элементу управления повторителем. Благодаря этому я посмотрел на идентификаторы элемента управления, где он ломался и останавливался в Visual Studio и что показывается на странице aspx. Идентификаторы идентичны, за исключением «#», которое JQuery имеет в начале, которого нет на странице.

В моем коде JQuery у меня есть:

JQuery(function ($) {

$('#<%=date.ClientID %>').mask("99/99/9999");

});

Можно ли указывать JQuery не включать "#" при поиске элемента управления? Я использовал UniqueID, но это меняет любое подчеркивание на «$», что не совпадает с тем, что есть на странице. Моя единственная проблема - знак "#" в начале идентификатора. Я даже добавил окно предупреждения, чтобы проверить, что текстовое поле было там, и оно вернулось как ноль. Я пытался даже добавить атрибут CssClass в текстовое поле, но это тоже из-за той же ошибки.

Обратите внимание, что пользовательский элемент управления с текстовым полем программно добавляется в ретранслятор.

Код ниже:

Управление пользователем с повторителем

<%@ Control Language="C#" AutoEventWireup="true" CodeBehind="Step4.ascx.cs"
    Inherits="Prototype.Step4" %>
<div style="height: 800px; margin-top: 20px; overflow-x: hidden; overflow-y: scroll">
    <p>
        <b>Edit Stage</b></p>

    <asp:Repeater ID="Edit" runat="server">
        <HeaderTemplate>
            <table>
        </HeaderTemplate>
        <FooterTemplate>
            </table>
        </FooterTemplate>
        <ItemTemplate>
            <tr>
                <td>
                    <asp:Label ID="RowLabel" runat="server" Text="Label" ></asp:Label>
                </td>
                <td>
                    <asp:PlaceHolder ID="ControlPlaceHolder" runat="server"></asp:PlaceHolder>
                </td>
            </tr>
        </ItemTemplate>
    </asp:Repeater>
</div>

Маска Элемент управления, который динамически добавляется к элементу управления выше

<%@ Control Language="C#" AutoEventWireup="true" CodeBehind="MaskControl.ascx.cs" Inherits="Prototype.CommonControls.MaskControl" %>


<asp:TextBox ID="date" runat="server" Width="136px" CssClass="dateMask"></asp:TextBox>


<script src="../../Scripts/jquery-1.4.2.js" type="text/javascript"></script>
<script src="../../Scripts/jquery.maskedinput.js" type="text/javascript"></script>

<script type="text/javascript">
//    jQuery(function ($) {
//        $('.dateMask').mask("99/99/9999");
//    });
    alert(document.getElementById("MaskedDateBox"));
</script>

Может кто-нибудь помочь?

Answer 1

jQuery(function() {
    jQuery('.dateMask').mask("99/99/9999");
});

должно работать.

Я не совсем уверен, что вы подразумеваете под:

сказать JQuery не включать "#" при поиске элемента управления

Когда вы используете # в селекторе, это означает поиск элемента управления по идентификатору.

Чище получить элементы управления asp.net, используя селектор класса, а не селектор идентификатора, ИМХО.

Итак, немного расширим объяснение.Если вы не используете ajax, то не имеет значения, как вы сгенерировали свои элементы управления - все ваши текстовые поля присутствуют на странице, когда происходит событие $ (document) .ready (), и их классы установлены.В этом случае вам нужно запустить следующий код только один раз (то есть поместить js на страницу, а не в элемент управления)

jQuery(function() {
    jQuery('.dateMask').mask("99/99/9999");
    jQuery('.phoneMask').mask("(999) 999-9999");  // if you have one
    ...
});

Если вы загружаете элементы управления с помощью ajax, чем запускатьjavascript код выше каждый раз, когда ajax-запрос завершается.Вы можете сделать это, зарегистрировав скрипт в ScriptManager в Page_Load следующим образом:

public void Page_Load(object sender, EventArgs e) {
    ScriptManager.RegisterStartupScript(updatePanel, updatePanel.GetType(), "mask", "initMask();", true);
}

Вам необходимо определить функцию javascript initMask () на своей странице.

function initMask() {
    jQuery('.dateMask').mask("99/99/9999");
    jQuery('.phoneMask').mask("(999) 999-9999");  // if you have one
    ...
}

Answer 2

вы пытались использовать:

$ (документ) .ready (function () { $ (. DateMask) .mask ( "99/99/9999"); });

Динамическое добавление usercontrol не изменит класс css добавленных элементов управления, где он изменит идентификатор на основе своего контейнера имен.