JavaScript-код внутри UpdatePanel

Question

ОК: у меня есть UpdatePanel на странице aspx, которая содержит один заполнитель.

Внутри этого заполнителя я добавляю один из выбора пользовательских элементов управления в зависимости от определенных внешних условий (это страница конфигурации).

В каждом из этих пользовательских элементов управления есть функция javascript bindUcEvents (), которая связывает различные события jQuery и javascript с кнопками и валидаторами внутри пользовательского элемента управления.

Проблема, с которой я столкнулся, заключается в том, что javascript usercontrol не распознается. Обычно javascript внутри панели обновлений выполняется, когда панель обновлений отправляет обратно, однако ни один из этих кодов не может быть найден на странице (я пробовал запускать функцию вручную через консоль firebug, но он говорит, что не может найти функцию).

У кого-нибудь есть предложения?

Cheers, Ed.

EDIT:

урезанный (но функциональный) пример:

Markup:

<script src="/js/jquery-1.3.2.min.js"></script>
  <form id="form1" runat="server">
    <div>

    <asp:ScriptManager ID="Script" runat="server" />

    <asp:Button ID="Postback" runat="server" Text="Populate" OnClick="PopulatePlaceholder" />

    <asp:UpdatePanel ID="UpdateMe" runat="server">
    <Triggers>
        <asp:AsyncPostBackTrigger ControlID="Postback" EventName="Click" />
    </Triggers>
        <ContentTemplate>
            <asp:Literal ID="Code" runat="server" />
            <asp:PlaceHolder ID="PlaceMe" runat="server" />
        </ContentTemplate>
    </asp:UpdatePanel>
    </div>
 </form>

C #:

protected void PopulatePlaceholder(object sender, EventArgs e)
{
    Button button = new Button();
    button.ID = "Push";
    button.Text = "push";
    button.OnClientClick = "javascript:return false;";
    Code.Text = "<script type=\"text/javascript\"> function bindEvents() { $('#" + button.ClientID + "').click(function() { alert('hello'); }); }  bindEvents(); </script>";
    PlaceMe.Controls.Add(button);
}

Вы увидите, что кнопка не отображает предупреждение, даже если код присутствует на странице.

EDIT2:

Хорошо, просто чтобы прояснить, рабочий код значительно сложнее, чем просто одна функция, связанная с литералом, и содержит большое количество

<%= Control.ClientID %>

битов кода, которые будет очень трудно разделить на неспецифические функции, и они бессмысленны, поскольку каждый из них используется только в одном месте (мы говорим об очень специфической валидации и нечетном триггере всплывающих окон + некоторая логика) .

Answer 1

Избавьтесь от этого элемента управления Literal и используйте ScriptManager для регистрации вашего скрипта. То, что вы делаете, не работает по той же причине

window.document.getElementById('someId').innerHtml = "<script type=\"text/javascript\">alert('hey');</script>";

не работает. Попробуйте это:

protected void PopulatePlaceholder(object sender, EventArgs e)
{
    Button button = new Button();
    button.ID = "Push";

    button.Text = "push";
    button.OnClientClick = "return false;";


    string script = "function bindEvents() { $('#" + button.ClientID + "').click(function() { alert('hello'); }); }  bindEvents();";

  ScriptManager.RegisterClientScriptBlock(this.Page, typeof(SomeClass), Guid.NewGuid().ToString(), script, true);


  PlaceMe.Controls.Add(button);
} 

Параметры в RegisterClientScriptBlock могут потребоваться изменить, но вы поняли.

Answer 2

Для повторного запуска некоторых js после запуска панели обновления, я всегда использовал это

Sys.WebForms.PageRequestManager.getInstance().add_endRequest(
    function(sender, args) {
        //update whatever here
    });

Также, если у вас есть какие-либо ссылки на элементы на панели обновления, вы также можете обновить эти переменные в этой функции, иначе у вас будут старые ссылки, которые не будут работать.

Answer 3

Добавьте скрипт-менеджер (Ajax Extensions) на свою страницу и добавьте ссылки на скрипты внутри этого менеджера. Менеджер будет загружать все теги скрипта при загрузке страниц на основе ajax (а не только при начальной загрузке) - переместите весь необходимый код JavaScript внутри панели обновления, и вы в значительной степени готовы.

    <asp:ScriptManager ID="ScriptManager1" runat="server">
        <Scripts>
            <asp:ScriptReference Path="../lib/jquery-1.2.6.pack.js" />

Не прочитал вопрос достаточно хорошо (и без образца). Смотрите мой новый ответ.

Answer 4

Может быть, вы ищете это: http://api.jquery.com/live/

Почти .bind () совместим (исключения перечислены в ссылке выше) - но также привязывается к элементам, добавленным / измененным позже.

Или может также попробовать .delegate () - не может напрямую заменить вызовы .bind (), но в большинстве случаев намного быстрее.

Answer 5

Почему-то кажется, что ваш Code.Text где-то теряется в переводе - не знаю специфики, возможно, это из-за замысла; в любом случае следующее работает:

    protected void PopulatePlaceholder(object sender, EventArgs e)
    {
        Button button = new Button();
        button.ID = "Push";
        button.Text = "push";
        button.OnClientClick = "javascript:return false;";
//        Code.Text = 
        PlaceMe.Controls.Add(button);
        PlaceMe.Controls.Add(new LiteralControl("<script type=\"text/javascript\"> function bindEvents() { $('#" + button.ClientID + "').click(function() { alert('hello'); }); }  bindEvents(); </script>"));
    }

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