Fancybox - кнопка ASP.NET не работает

Question

Я только что определил использование Firebug, что при создании окна Fancybox он фактически принимает все мои элементы управления ASP.NET (содержащиеся в теге DIV) и помещает их вне тега FORM. Поэтому я думаю, что это причина, почему тогда кнопка ASP.NET ничего не делает - она ​​помещается вне формы.

Итак, есть ли у вас какие-либо предложения, как я могу предотвратить это (или заставить эту кнопку ASP.NET работать), кроме использования совершенно другого модального диалога?

EDIT: ОК, люди сообщают, что некоторые из предлагаемых исправлений работают на них в определенных версиях. Поэтому обязательно прочитайте все ответы/прокрутите до конца, как исправить эту проблему в разных версиях Fancybox.

Answer 1

Вы должны изменить (где-то около линии 719 jquery.fancybox-1.3.1.js):

$('body').append(
    tmp   = $('<div id="fancybox-tmp"></div>'), 
    loading  = $('<div id="fancybox-loading"><div></div></div>'), 
    overlay  = $('<div id="fancybox-overlay"></div>'), 
    wrap  = $('<div id="fancybox-wrap"></div>') 
     ); 

к

$('form').append(
    tmp   = $('<div id="fancybox-tmp"></div>'), 
    loading  = $('<div id="fancybox-loading"><div></div></div>'), 
    overlay  = $('<div id="fancybox-overlay"></div>'), 
    wrap  = $('<div id="fancybox-wrap"></div>') 
); 

Answer 2

Я пытался выяснить это проблема всю неделю, я на самом деле не было никакой удачи

Я просто наткнулся на эту статью

http://usmanshabbir.blogspot.com/2010/10/click-server-button-problem-in-jquery.html

Это объясняет, как получить обратную связь с диалоговым окном jQuery UI.

Если это не на 100% необходимо использовать причудливую коробку, то этот метод определенно стоит попробовать, сегодня это избавило меня от хлопот.

Answer 3

Данное обновление не работает для меня, fancybox по-прежнему добавлялся вне формы. Затем я прокомментировал эти 6 строк в jquery.fancybox-1.3.2.js и обнаружил, что они вообще не используются в моем коде.

Я сделал поиск по 'тела' в FancyBox файлов и расслоение плотной изменили его 'формы' в:

jquery.fancybox-1.3.2.js (пер 484)
jquery.fancybox-1,3 .2.pack.js (ln 27, ln 41)

Теперь fancybox добавляется в форму и серверные элементы управления работают.

Answer 4

jquery.fancybox-1.3.4.js линия 1040

//$('body').append(
    $('form').append(
      tmp = $('<div id="fancybox-tmp"></div>'), 
      loading = $('<div id="fancybox-loading"><div></div></div>'), 
      overlay = $('<div id="fancybox-overlay"></div>'), 
      wrap = $('<div id="fancybox-wrap"></div>') 
     ); 

Works (мой жерех: кнопка делает постбэк) для меня на FF и IE9, спасибо за решение

Answer 5

без изменения FancyBox источник, поместите это после того, как сценарий FancyBox (вне любых нагрузочных событий !!!):

<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/#.#/jquery.min.js"></script> 
<script type="text/javascript" src="/fancybox/jquery.fancybox-#.#.#.pack.js"></script> 
<script type="text/javascript"> 

    // Override $.fancybox.init to fix ASP.NET PostBack bug; 
    var fancyboxInitOld = $.fancybox.init; 
    $.fancybox.init = function() { 
     fancyboxInitOld.apply(arguments); 
     $("#fancybox-tmp, #fancybox-loading, #fancybox-overlay, #fancybox-wrap").appendTo("form:first"); 
    }; 

    // Your code ... 

</script> 

Answer 6

FancyBox Версия: 2.1.2

Линия 1782 из jquery.fancybox.JS

Изменить это:

this.el  = document.all && !document.querySelector ? $('html') : $('body'); 

Для этого:

this.el  = document.all && !document.querySelector ? $('html') : $('form:first'); 

Answer 7

Я использую FancyBox 1.3.4, чтобы показать страницу ASPX в качестве всплывающей страницы в FancyBox фрейма. Но кнопка на всплывающей странице не вызывает обратную передачу. Я ничего не изменил, как вы говорили раньше. Скорее я сделал следующее.

function check() 
{ 
      var validated = Page_ClientValidate(); 
      if (validated) { 
       __doPostBack('<%=bur.ClientID%>','');    
       parent.$.fancybox.close();              
       return true; 
      } 
      else 
      { 
       return false; 
      } 
} 



<asp:Button ID="bur" runat="server" Text="ser" 
      OnClientClick="check()" /> 


protected void bur_Click(object sender,Eventargs e) 
{ //put breakpoint here. 

} 

Answer 8

Fancybox 1.3.4 на самом деле делает обратную связь.

Но если он закрыт в OnClientClick, который находится перед событием на стороне сервера, он не будет возвращать. Так вышесказанное является решением этой проблемы. (Добавление doPostBack в функцию javascript).

Обычно Fancybox 1.3.4 выполняет обратную передачу без каких-либо изменений в своих .Js-файлах. Но чтобы закрыть его, нужно написать эту строку ScriptManager.RegisterClientScriptBlock(this, GetType(), "", "parent.$.fancybox.close();", true); в событии клика на стороне сервера. Только тогда вызываются и события serveride, и fancybox также закрывается.

Но Fancybox 2.1.3 (последнее) делает событие обратной передачи после того, как оно закрыто в OnClientClick.

Answer 9

FancyBox Версия 2.1.4

Изменить эти 2 линии

вокруг линии 2069:

document.all && !document.querySelector ? $('html') : $('body'); 

к

document.all && !document.querySelector ? $('html') : $('form:first'); 

и вокруг линии 1960:

this.overlay = $('<div class="fancybox-overlay"></div>').appendTo('body'); 

в

this.overlay = $('<div class="fancybox-overlay"></div>').prependTo('form'); 

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

Answer 10

Для тех, кому нужен простой ответ на эту проблему с использованием Fancybox версии 2, гораздо проще это сделать. Все, что вам нужно сделать, это добавить родителя: «форма: первый» в коде, например

$(document).ready(function() { 
     $(".various").fancybox({ 
      parent: "form:first", 
      fitToView: true, 
      width: '300px', 
      height: '100px', 
      autoSize: false, 
      closeClick: false, 
      openEffect: 'none', 
      closeEffect: 'none', 
      modal: false 
     }); 
    }); 

, то это будет добавлять элементы FancyBox в йот внутри тега формы, а не внутри тела тега.

Answer 11

Если освежать родитель является решением, которое служит целям, вы можете обновить OnClosed:

$(".fancybox").fancybox({ 
    'onClosed': function() { 
    parent.location.reload(true); 
    } 
}); 

Answer 12

без каких-либо изменений в FancyBox расслоения плотного файла библиотеки, что работает для меня был ниже,

$('.your-selector').fancybox({ 
     afterShow: function() { 
      $('.fancybox-overlay').appendTo('form'); 
     } 
}); 

Я переместил fancybox div внутри тега формы, и теперь серверная кнопка работает как шарм :) Все самое лучшее .. Надеюсь, это тоже сработает для вас. ,:)

Answer 13

Вам не нужно изменять любой код или любую библиотеку ... Просто попробуйте это .. возможно

$('.fancybox').fancybox({ 
    parent: "form:first", // jQuery selector 
}); 

Answer 14

Heres худшее решение, однако он работал для меня. Мне одновременно нужны были faceybox и codebehind. Настройте свой причудливый ящик для загрузки при нажатии кнопки. Затем onClosed передать значения на другую страницу C# и сделать код на странице Load.

<script type="text/javascript"> 
    $(document).ready(function() { 
    $(".fancy").fancybox({ 
     onClosed: function() { 
      window.location.href = "worker_addcarrier.aspx?name=" + document.getElementById('<%=txt_carriername.ClientID%>').value + 
       "&password=" + document.getElementById('<%=txt_password.ClientID%>').value + 
       "&email=" + document.getElementById('<%=txt_email.ClientID%>').value; 
     } 
    }); 
}); 

, а затем просто "класс =" вещь здесь:

<asp:Button ID="Button1" href="logo.png" runat="server" class="fancy" Text="Create" Width="109px" BorderColor="#009933" OnClick="Button1_Click" />