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

Question

в приложении ASP.net/C#.Я использую панель обновления и заполнитель внутри нее для динамической загрузки элементов управления

<asp:UpdatePanel ID="UpdatePanel1" runat="server" UpdateMode="Conditional">
    <Triggers>
        <asp:AsyncPostBackTrigger ControlID="LinkButton1" EventName="Click"/>
    </Triggers>
    <ContentTemplate>
        <asp:PlaceHolder ID="PlaceHolder1" runat="server">
        </asp:PlaceHolder>
    </ContentTemplate>
</asp:UpdatePanel>

Когда я нажимаю на LinkButton1, я загружаю пользовательский элемент управления в PlaceHolder:

protected void LinkButton1_Click(object sender, EventArgs e)
{
    PlaceHolder1.Controls.Clear();
    MyControl C;
    C = (MyControl1 )LoadControl("Controls/MyControl.ascx");
    PlaceHolder1.Controls.Add(C);
}

Всеэлемент управления у меня загружен правильно.

Но проблема заключается в следующем:

У меня есть элемент управления, который использует Javascript и Jquery для создания раскрывающейся анимации, когда я нажимаю на div.Этот элемент управления работает правильно при загрузке на страницу обычным PostBack, но когда я загружаю его в панель обновлений с использованием частичной обратной записи, он загружается, но JavaScript перестает работать (больше нет анимации и других вещей)

Как я могу заставить их работать при загрузке элемента управления через частичную обратную передачу?

Answer 1

Я думаю, что использование Jquery "Live" может быть тем ответом, которое вы ищете, это позволит отслеживать изменения в DOM.

$ ("{YOURQUERY}"). Live ("click", function (){alert ("До свидания!");});

Для получения дополнительной информации посмотрите документацию jquery.

Answer 2

Когда вы делаете .bind (), вы подключаете событие только для элементов, присутствующих в DOM в данный момент, то есть когда вы выполняете .bind (). Элементы управления, которые вы загружаете асинхронно через частичную обратную передачу, отсутствуют в document.ready, поэтому ваши события не работают.

Вы должны использовать live или делегат или, что еще лучше, если вы используете jQuery 1.7 или более позднюю версию, вы должны использовать новую on-function :

$(function(){
    $('placeholder-selector').on('click' , 'your-clickable-selector', function(){
        //do your animation here
    });
});

Answer 3

Я предполагаю, что ваша анимация для выпадающих меню выполняется наготове.Таким образом, начальная загрузка страницы настраивает анимацию там, где это необходимо, в раскрывающихся списках.

При частичном посте возвращается только тот раздел, который загружается и анимация не настраивается.Так как он не был частью Dom на начальном этапе готовности.

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

Редактировать

Как контролировать, какой JavaScript запускается после частичной обратной передачи UpdatePanel endRequest?

Должно помочь вам выполнить JavaScriptпосле возвращения панели обновлений.

Answer 4

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