質問をすることでしか得られない、回答やアドバイスがある。

15分調べてもわからないことは、質問しよう!

新規登録して質問してみよう
ただいま回答率
85.50%
C#

C#はマルチパラダイムプログラミング言語の1つで、命令形・宣言型・関数型・ジェネリック型・コンポーネント指向・オブジェクティブ指向のプログラミング開発すべてに対応しています。

JavaScript

JavaScriptは、プログラミング言語のひとつです。ネットスケープコミュニケーションズで開発されました。 開発当初はLiveScriptと呼ばれていましたが、業務提携していたサン・マイクロシステムズが開発したJavaが脚光を浴びていたことから、JavaScriptと改名されました。 動きのあるWebページを作ることを目的に開発されたもので、主要なWebブラウザのほとんどに搭載されています。

ASP.NET

ASP.NETは動的なWebサイトやWebアプリケーション、そしてWebサービスを構築出来るようにする為、Microsoftによって開発されたウェブアプリケーション開発フレームワークです。

Q&A

解決済

1回答

6635閲覧

modalで表示した画面を保持したまま、確認ダイアログを表示させたい

asr

総合スコア19

C#

C#はマルチパラダイムプログラミング言語の1つで、命令形・宣言型・関数型・ジェネリック型・コンポーネント指向・オブジェクティブ指向のプログラミング開発すべてに対応しています。

JavaScript

JavaScriptは、プログラミング言語のひとつです。ネットスケープコミュニケーションズで開発されました。 開発当初はLiveScriptと呼ばれていましたが、業務提携していたサン・マイクロシステムズが開発したJavaが脚光を浴びていたことから、JavaScriptと改名されました。 動きのあるWebページを作ることを目的に開発されたもので、主要なWebブラウザのほとんどに搭載されています。

ASP.NET

ASP.NETは動的なWebサイトやWebアプリケーション、そしてWebサービスを構築出来るようにする為、Microsoftによって開発されたウェブアプリケーション開発フレームワークです。

0グッド

0クリップ

投稿2016/10/31 04:28

編集2016/10/31 05:47

現在、親の画面A.aspxでbootstrapのmodalを使い、子の画面B.aspxをmodal表示させています。

A.aspx

<form id="form1" runat="server"> <span id="B_Button"><a href="B.aspx?No=1" data-toggle="modal" data-target="#Bmodal"><img src="../../../IMG/pen1.jpg"></a></span> <!-- モーダル・子画面--> <div class="modal fade" id="Bmodal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" style="overflow-y:auto"> <div class="modal-dialog" role="document" style="width:732px"> <div class="modal-content"> <div class="modal-body"> </div> </div> </div> </div> </form>

pen1.jpgを押下すると、子の画面B.aspxをmodal表示されます。表示させた子の画面B.aspxには登録ボタンがあり、押下するとB.aspx.csで

protected void ButtonAdd_Click(object sender, EventArgs e) { string msg = ""; msg = "登録しますか"; string formid = this.Form.ClientID; // 確認ダイアログを出力するスクリプト string sScript = "if(confirm(\"" + msg + "?\")){ " + formid + ".method = \"post\";" + formid + ".action = \"B.aspx?no=" + ID + "&update=true\";" + formid + ".submit();" + "}else{" + "" + "}"; // JavaScriptの埋め込み ClientScript.RegisterStartupScript(this.GetType(), "startup", sScript, true); }

が実行され、javascriptを埋め込んでPostBackしています。
その後はmodal表示が消えてB.aspxのページ遷移し、確認ダイアログが表示されてしまいます。

PostBack後、子の画面B.aspxをmodal表示で保持したまま、確認ダイアログを表示することは可能でしょうか。
可能であればやり方を是非教えて頂きたいです。

気になる質問をクリップする

クリップした質問は、後からいつでもMYページで確認できます。

またクリップした質問に回答があった際、通知やメールを受け取ることができます。

バッドをするには、ログインかつ

こちらの条件を満たす必要があります。

退会済みユーザー

退会済みユーザー

2016/10/31 04:53

コードは ``` と ``` で囲ってください。インデントされて見やすくなりますので。
guest

回答1

0

ベストアンサー

Bootstrap の JavaScript(URL 下記) の説明によると、a 要素の href 属性に指定した B.aspx ページが jQuery load メソッドで .modal-content div 要素に inject されるそうですが、.aspx のような動的なページでそういうことをしては modal は関係なく全体的にうまく動かないと思います。

http://getbootstrap.com/javascript/#modals-options

.modal-content div 要素に以下のように iframe 要素を置いてその src 属性に B.aspx?No=1 を設定し、

<div class="modal-body"> <iframe src="B.aspx?No=1"></iframe> </div>

modal を起動するのに a 要素は使わず、例えば普通の button で以下のようにしてはいかがですか?

<input id="Button1" type="button" value="button" data-toggle="modal" data-target="#Bmodal" />

そうすれば親画面の A.aspx と、親画面の中の iframe の B.aspx は独立して動くので、質問者さんのやりたいことが実現できるのではないかと思います。

お試しください。

投稿2016/10/31 06:11

編集2016/10/31 07:57
退会済みユーザー

退会済みユーザー

総合スコア0

バッドをするには、ログインかつ

こちらの条件を満たす必要があります。

asr

2016/10/31 08:30

解答ありがとうございます。 結論から言うと、実現できました。ありがとうございます。 ただ、表示させた子の画面B.aspxで閉じるボタンも設置しているのですが、今までは ``` <asp:Button ID="ButtonCancel" runat="server" Text="戻る" CssClass="btn btn-default" data-dismiss="modal"/> ``` でmodalを閉じていましたが、今回iframeに変わったため、子画面から閉じるようにしないといけないと思いますが、この場合どうやって閉じればよいでしょうか。 追加の質問みたいで申し訳ございません。
退会済みユーザー

退会済みユーザー

2016/10/31 08:47

Modal のサンプルコード(以下の URL 参照)にあるように div class="modal-header" を追加してその中に [×] ボタンを追加するとか、div class="modal-footer" を追加してその中に [Close] ボタンを追加してはいかがですか? http://getbootstrap.com/javascript/#modals-examples
asr

2016/10/31 09:56

単純にmodalを指定してるdivの中に各閉じるボタンを追加するだけだったんですね。 大変助かりました。ありがとうございます。
guest

あなたの回答

tips

太字

斜体

打ち消し線

見出し

引用テキストの挿入

コードの挿入

リンクの挿入

リストの挿入

番号リストの挿入

表の挿入

水平線の挿入

プレビュー

15分調べてもわからないことは
teratailで質問しよう!

ただいまの回答率
85.50%

質問をまとめることで
思考を整理して素早く解決

テンプレート機能で
簡単に質問をまとめる

質問する

関連した質問