21

Firebugを使用して、Fancyboxウィンドウが作成されると、実際にはすべてのASP.NETコントロール（DIVタグに含まれている）を取得し、それらをFORMタグの外に配置することを決定しました。だから私はこれがASP.NETボタンが何もしない理由だと思います-それはフォームの外に配置されます。

それで、完全に異なるモーダルダイアログを使用する以外に、これを防ぐ（またはASP.NETボタンを機能させる）方法について何か提案はありますか？

編集： OK、人々は提案された修正のいくつかが特定のバージョンで彼らのために働いていると報告しています。したがって、さまざまなFancyboxバージョンでこの問題を修正する方法については、必ずすべての回答を読んで/一番下までスクロールしてください。

4

14 に答える 14

33

これを変更する必要があります（jquery.fancybox-1.3.1.jsの719行目あたり）：

$('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>')
);
于 2010-04-21T22:32:19.173 に答える
19

Fancyboxバージョン2を使用してこの問題に対する簡単な答えが必要な場合は、はるかに簡単な方法があります。あなたがしなければならないのは、コードに親を追加することです： "form：first"例：

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

次に、これにより、bodyタグ内ではなく、formタグ内のdomにfancybox要素が追加されます。

于 2013-08-13T14:24:37.670 に答える
5

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を使用することもできますが、それはあなた次第です。私の場合、prependToが必要でした。

于 2013-03-14T14:41:00.823 に答える
4

私は一週間この問題を理解しようとしてきました、私は本当に運がありませんでした

私はちょうどこの記事に出くわしました

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

これは、jQueryUIダイアログボックスでポストバックを機能させる方法を説明しています。

ファンシーボックスを100％使用する必要がない場合、この方法は間違いなく試してみる価値があります。今日、私は多くの手間を省くことができました。

于 2010-10-22T14:39:40.243 に答える
4

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>
于 2012-05-25T11:46:42.217 に答える
2

上記の更新は私には機能しませんでした、ファンシーボックスはまだフォームの外に追加されました。次に、jquery.fancybox-1.3.2.jsの6行をコメントアウトしたところ、コードでまったく使用されていないことがわかりました。

fancybox jsファイルで「body」を検索し、次の「form」に変更しました。

jquery.fancybox-1.3.2.js（ln 484）
jquery.fancybox-1.3.2.pack.js（ln 27、ln 41）

fancyboxがフォームに追加され、サーバーコントロールが機能しています。

于 2010-11-01T09:52:42.860 に答える
2

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>')
        );

FFとIE9で動作します（私のasp：Buttonはポストバックします）、ソリューションに感謝します

于 2011-04-27T00:57:19.747 に答える
1

Fancyboxバージョン：2.1.2

jquery.fancybox.jsの1782行目

これを変える：

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

これに：

this.el     = document.all && !document.querySelector ? $('html') : $('form:first');
于 2012-10-18T09:26:44.343 に答える
1

Fancybox 1.3.4を使用して、aspxページをfancyboxiframeのポップアップページとして表示します。ただし、ポップアップページのボタンはポストバックを引き起こしません。あなたが前に言ったように私は何も変えませんでした。むしろ私は次のことをしました。

 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.

}
于 2013-01-02T14:14:20.497 に答える
0

Fancybox1.3.4は実際にポストバックを行います。

ただし、サーバー側のクリックイベントの前にあるOnClientClickで閉じられている場合、ポストバックは行われません。したがって、上記はこの問題の解決策です（javascript関数にdoPostBackを追加します）。

通常、Fancybox 1.3.4は、.Jsファイルを変更せずにポストバックを実行します。ScriptManager.RegisterClientScriptBlock(this, GetType(), "", "parent.$.fancybox.close();", true);ただし、閉じるには、サーバー側のクリックイベントにこの行を書き込む必要があります。その後、両方のサーバーサイドイベントが呼び出され、fancyboxも閉じます。

ただし、Fancybox 2.1.3（最新）は、OnClientClickで閉じられた後にポストバックイベントを実行します。

于 2013-01-03T09:15:16.043 に答える
0

親の更新が目的に役立つソリューションである場合は、onClosedを更新できます。

$(".fancybox").fancybox({
  'onClosed': function() {
   parent.location.reload(true);
  } 
});
于 2013-08-14T14:12:19.650 に答える
0

fancybox jsライブラリファイルに変更を加えなくても、私にとってうまくいくのは以下のとおりです。

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

fancybox divをformタグ内に移動しましたが、サーバー側のボタンが魅力のように機能しています:)最高です。これがあなたにも役立つことを願っています。。:)

于 2015-04-17T05:18:48.093 に答える
0

コードやライブラリを変更する必要はありません...これを試してみてください。

$('.fancybox').fancybox({
     parent: "form:first", // jQuery selector
});
于 2017-03-31T08:19:35.430 に答える
0

これが可能な限り最悪の解決策ですが、それは私にとってはうまくいきました。私はfaceyboxとcodebehindを同時に必要としていました。ボタンがクリックされたときにロードするようにファンシーボックスを設定します。次に、onClosedは値を別のC＃ページに渡し、ページの読み込みでコードビハインドを実行します。

<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;
        }
    });
});

次に、ここで「class=」を使用します。

<asp:Button ID="Button1" href="logo.png" runat="server" class="fancy" Text="Create" Width="109px" BorderColor="#009933" OnClick="Button1_Click" />
于 2017-06-10T18:46:11.973 に答える