Проблемы jQuery в пользовательском веб-элементе управления в расширителе модальных всплывающих окон на панели обновления

Ну, проблема кажется немного запутанной.

В одной руке у меня Update Panel. Внутри этого Update Panel у меня есть Modal Popup Extender, а содержимое этого всплывающего окна — Web User Control.

В моем User Control я пытаюсь включить слайдер галереи (http://bxslider.com/), который должен быть инициализирован просто с помощью строк JavaScript:

$(document).ready(function() {
  $('.bxslider').bxSlider();
}

, где .bxslider — класс контейнера, в котором определены слайды галереи.

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

Теперь, если я получаю доступ к консоли Chrome, волшебным образом отображается галерея.

Я пытался поставить инициализацию в нескольких местах:

  1. В файле разметки Web User Control в начале.

  2. В файле разметки Web User Control в конце.

  3. В событии Web User Control Load:

    protected void Page_Load(object sender, EventArgs e) {
      String script = "$(document).ready(function() { $('.bxslider').bxSlider(); }";
      ScriptManager.RegisterStartupScript((Control)this.Page, this.Page.GetType(), new Guid().ToString(), script, true);
    }
    
  4. В событии Web User Control LoadComplete (привязка через событие Init):

    protected void Page_Init(object sender, EventArgs e) {
      this.Page.LoadComplete += new EventHandler(Page_LoadComplete);
    }
    
    protected void Page_LoadComplete(object sender, EventArgs e) {
       String script = "$(document).ready(function() { $('.bxslider').bxSlider(); }";
       ScriptManager.RegisterStartupScript((Control)this.Page, this.Page.GetType(), new Guid().ToString(), script, true);
    }
    
  5. В событии Modal Popup Extender OnLoad.

Я полностью потерян. Есть идеи?

EDIT: я думаю, что здесь правильный вопрос: есть ли способ установить метод, который вызывается только при отображении Modal Popup Extender, а не при его загрузке?


person adripanico    schedule 30.10.2013    source источник


Ответы (2)


Ну наконец-то решил.

Решение состояло в том, чтобы назначить TargetControlID модального всплывающего окна фиктивной кнопке, а затем объявить элемент управления, который я действительно хочу открыть, как всплывающее окно:

<asp:Button id="Button1" runat="server" OnClientClick="$find('PopupBehaivourID').show(); setTimeout(function () { $('.bxslider').bxSlider(); }, 100); return false;" Text="Show me!" />

Это решает проблему «грязным» способом, поэтому, если у кого-то есть другие предложения, мы будем очень рады.

person adripanico    schedule 30.10.2013

Новый подход!

Вместо предыдущего, который переопределял ползунок каждый раз, когда открывается всплывающее окно (вызывая другие проблемы), я инициализировал ползунок непосредственно в User Web Control:

<script type="text/javascript">
  var slider;
  $(document).ready(function () {
    slider = $('.bxslider').bxSlider();
</script>

А затем элемент управления, который запускает всплывающее окно, выглядит так:

<asp:Button id="Button1" runat="server" OnClientClick="$find('PopupBehaivourID').show(); slider.reloadSlider(); return false;" Text="Show me!" />

т.е. я сейчас использую метод, который перезагружает галерею каждый раз.

person adripanico    schedule 30.10.2013