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

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

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

Windows Internet Explorer 8は、マイクロソフトによって開発されたウェブブラウザで、2009年の3月19日に、Windows XP、Windows Server 2003、Windows Vista、Windows Server 2008、そしてWindows 7に組み込まれました。

Windows 7

Microsoft Windows 7は過去にリリースされたMicrosoft WindowsのOSであり、Windows8の1代前です。2009年の7月にリリースされ販売されました。Windows7の前はWindowsVistaで、その更に3年前にリリースされました。

JavaScript

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

ASP.NET

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

Q&A

解決済

3回答

9860閲覧

javascriptで開いた子画面を「キャンセル」ボタンで閉じた場合に、親画面の処理を止めたい。

meesa

総合スコア12

Internet Explorer 8

Windows Internet Explorer 8は、マイクロソフトによって開発されたウェブブラウザで、2009年の3月19日に、Windows XP、Windows Server 2003、Windows Vista、Windows Server 2008、そしてWindows 7に組み込まれました。

Windows 7

Microsoft Windows 7は過去にリリースされたMicrosoft WindowsのOSであり、Windows8の1代前です。2009年の7月にリリースされ販売されました。Windows7の前はWindowsVistaで、その更に3年前にリリースされました。

JavaScript

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

ASP.NET

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

0グッド

0クリップ

投稿2018/01/26 07:09

編集2018/01/26 08:04

前提・実現したいこと

お世話になります。自分でも調べてみたのですが、どうにも上手くいかなかったので、質問させてください。

ASP.NETでWEBアプリを開発しています。
親画面と、コメントを入力させるための子画面の、2つの画面があります。
親画面で「コメント入力」ボタンをクリックしたとき、javascriptで子画面をモーダル表示させています。
子画面には、コメント入力用のテキストボックスと、「登録」「キャンセル」の2つのボタンがあり、「登録」ボタンが押された場合は親画面にテキストボックスの値を渡して画面を閉じます。
親画面では、子画面で入力したコメントを受け取り、DBへ登録処理を行います。このDB登録処理は、親画面の「コメント入力」ボタンクリックイベントで処理しています。
「キャンセル」ボタンが押された場合は登録処理を行わず(=親画面の「コメント入力」ボタンクリックイベントを発生させず)、ただ子画面を閉じるのみの動きをさせたいです。

発生している問題・エラーメッセージ

キャンセルボタンを押したときも、「コメント入力」ボタンクリックイベントが発生し、DBへの登録処理が行われてしまいます。

なお、挙動としては、「キャンセル」ボタンクリック → 一度画面が閉じる? → 同じ画面が開きなおす、という変な動きも発生しています。
ちなみにこの開き直す挙動は、「登録」ボタンをクリックした場合にも発生しています。
なので、今のところ「キャンセル」と「登録」の違いが、DBにテキストボックスの値が登録されるか、されないか、というところのみになっています。
この動き自体もおかしいので、調べているのですが、似たような状況の資料が見付けられず、対策が分かりません……。

「キャンセル」ボタンクリック時、Visual Studioでデバッグした際の動きを見る限り、javascriptのIF分岐は、意図したとおりに「return false;」を通過しています。
「return false;」を入れることでクライアントでエラーを発生させ、サーバーに処理を投げなくなり、ボタンクリックイベントを停止させることが出来る、という理解をしているのですが、そうではないのでしょうか?

該当のソースコード

親画面

javascript

1function ClickCommentButton() { 2 var demno = document.getElementById("lbl_DemNo").innerText; 3 var url = 'Comment.aspx?btn=input&demno=' + demno; 4 var rtn = window.showModalDialog(url, "_blank", "dialogHeight:250px; dialogWidth:600px;"); 5 if (rtn === void 0) { 6 return false; 7 } else { 8 document.getElementById("hid_Comment").value = rtn; 9 return true; 10 } 11}

HTML

1<form id="form1" runat="server"> 2 <div id="main"> 3 <h1>申請内容</h1> 4 <div class="DemInfo"> 5 状況:<asp:Label ID="lbl_Status" runat="server" Text="作成中"></asp:Label> 6 <asp:HiddenField ID="hid_StatusCD" runat="server" Value="0" /> 7 8 <label class="wid80">申請管理No.</label> 9 <asp:Label ID="lbl_DemNo" runat="server" Text="未設定" class="clearLeft"></asp:Label> 10 <asp:HiddenField ID="hid_Comment" runat="server" /> 11 </div> 12 <div class="DemButton"> 13 <asp:Button ID="btn_Cancel" runat="server" Text="キャンセル" class="btn_Middle" 14 onclientclick="window.close()" /> 15 <asp:Button ID="btn_comment" runat="server" Text="コメント入力" 16 class="btn_Learge" onclientclick="ClickCommentButton()" /> 17 <asp:Button ID="btn_OK" runat="server" Text="更新" class="btn_Middle" /> 18 </div> 19 </div> 20</form>

asp.net

1Protected Sub btn_Comment_Click(sender As Object, e As EventArgs) Handles btn_comment.Click 2 Dim Comment As New String = "" 3 Dim M01 As New M01_GetData 4 5 'コメントを取得 6 Comment = hid_Comment.Value 7 8 'コメントDB登録(コメントと更新日時をDB登録している) 9 If M01.UpdateComment(Comment) = True Then 10 '正常終了の場合画面を再表示 11 SetDemInfo(Session("UserID"), DI.DemNo) 12 End If 13 End Sub

子画面

javascript

1function ReturnComment() { 2  //テキストボックスに入力されたコメントを返す 3 window.returnValue = document.getElementById("txtb_Comment").value; 4 window.close(); 5} 6 7function CancelButtonClick() { 8 window.close(); 9}

html

1<form id="form1" runat="server"> 2 <h1>NGコメント</h1> 3 <div> 4 <asp:Label ID="lbl_Msg" runat="server" Text="コメントを入力してください。"></asp:Label> 5 </div> 6 <div class="btm-margin"> 7 <asp:TextBox ID="txtb_Comment" runat="server" 8 Rows="4" TextMode="MultiLine" Width="400px"></asp:TextBox> 9 </div> 10 <div class="btm-margin"> 11 <asp:Button ID="btn_Cancel" runat="server" Text="キャンセル" 12 CssClass="btn_Middle" OnClientClick="CancelButtonClick();" /> 13 <asp:Button ID="btn_RetComment" runat="server" Text="登録" 14 CausesValidation="True" CssClass="btn_Learge" 15 OnClientClick="ReturnComment();" /> 16 </div> 17</form>

試したこと

このサイトを参考にしています。
http://office-yone.com/blog/postback/

補足情報(FW/ツールのバージョンなど)

asp.net 4.0 / Visual Studio 2010 / Internte Exploler 8, 11
※社内システムにつき、古い環境で稼動させる必要があり苦労しております・・・・・・

不明点があればご指摘ください。よろしくお願いいたします。

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

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

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

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

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

defghi1977

2018/01/26 07:35

親画面側のHTML(aspx)を追記すべきかと思われます.
meesa

2018/01/26 07:44

お手数おかけしてすみません。親画面側のHTMLコードを追記しました。
defghi1977

2018/01/26 08:02

あと, (可能であれば)タグに「windows」とか「internet explorer」等を追加したほうが判りやすいかもしれません. (質問をしたことがないので出来るかわからない)
meesa

2018/01/26 08:05

ご指摘ありがとうございます。動作環境のタグを追加しました。
guest

回答3

0

ASP.NET

1OnClientClick="return ClickCommentButton();"

ほかも同じように書いたほうがいいでしょう。

方法 : クライアント スクリプトで Button Web サーバー コントロール イベントに応答する
https://msdn.microsoft.com/ja-jp/library/ms227426(v=vs.100).aspx

投稿2018/01/26 07:58

x_x

総合スコア13749

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

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

meesa

2018/01/26 08:10

回答ありがとうございます!おっしゃるとおり、returnを追加したところ意図したとおりに動きました。 お二方にベストアンサーを付けたかったのですが、仕組み上付けられず・・・大変申し訳ありませんが、僅差で先に回答頂いたdefghi1977さんをベストアンサーとさせていただきました。
guest

0

showModalDialogは廃止になったはずです。
それを前提とした質問であれば使用を停止して下さいとしか・・・

投稿2018/01/26 07:27

yambejp

総合スコア114572

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

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

defghi1977

2018/01/26 07:31

前提がIE限定なので, これでよろしかろうと.
meesa

2018/01/26 07:35

な、なんと、、、浅学ながら知りませんでした。 そうなると、window.openで開くのが一番確実なのでしょうか。
yambejp

2018/01/26 07:46

> window.openで開くのが一番確実 別ウィンドウを開きたいならそうなりますね ただ子ウィンドウは裏にはっちゃうこともあるので微妙です。 各種ライブラリのなかには疑似モーダル処理がいくつか公開されているので それを利用するのが手っ取り早いと思います 本来であればdialogタグがその役目を担うはずなんですが まだ使い勝手がよいとはいえません
meesa

2018/01/26 07:55

>yamabejp様 回答ありがとうございます。 初歩的な質問で大変申し訳ありませんが、「各種ライブラリ」とは、どういったものでしょうか? 詳しく教えていただけますと大変助かります。
退会済みユーザー

退会済みユーザー

2018/01/26 09:14

横レス失礼します。 showModalDialog など使うのは例え IE 限定であっても避けるべきです。showModalDialog 問題 などをキーワードにググってみてください。(そんなの使うのは豆腐の角に・・・という過激な意見もあるようです) ASP.NET Web Forms アプリのようですが、であれば、Ajax Control Toolkit の ModalPopupExtender の利用を検討してみてください。 他には、jQuery UI の Dialog 等もあります。
x_x

2018/01/26 09:37

jQueryと違ってjQuery UIはメニューにバグがあったりしてそれほど信用できないんですよね。最新の1.12.*はIE11までなので論外で、古いバージョンのものを使わなければなりませんが、IE8はどれを使えばいいんでしょう。
退会済みユーザー

退会済みユーザー

2018/01/26 12:02

IE8 はすでに試せる環境を持ってないので分かりません。IE9 なら 1.8.16 で対応可能というのは昔確認しましたが・・・ デモを IE8 で試してダメでしたか?
x_x

2018/01/26 12:05

そういう検証も含め、沼にはまりそうです。確かスクロール中のダイアログにも座標計算を間違えるバグがあったはず。放置されてバージョン上がっていきましたが
退会済みユーザー

退会済みユーザー

2018/01/26 12:15

それでも showModalDialog でハマるよりはりかによさそうな気がします。サーバーコントロール、ViewState、ポストバックというテクニックを使う ASP.NET Web Forms アプリですから、同一ページ内で全ての処理ができるように Ajax Control Toolkit の ModalPopupExtender や jQuery UI の Dialog を使うことには大きなメリットがあると思います。
guest

0

ベストアンサー

以下は動作を確認していません. また回答者はASP.netをほとんど忘れています.


returnが抜けている可能性があります.

HTML

1<!--ASP.net--> 2 <div class="DemButton"> 3 <asp:Button ID="btn_Cancel" runat="server" Text="キャンセル" class="btn_Middle" 4 onclientclick="window.close()" /> 5 <asp:Button ID="btn_comment" runat="server" Text="コメント入力" 6 class="btn_Learge" onclientclick="return ClickCommentButton();" /><!--←--> 7 <asp:Button ID="btn_OK" runat="server" Text="更新" class="btn_Middle" /> 8 </div> 9

参考
Stop Postback on Button OnClientClick()
また, 提示の参考ページにおいてもreturn falseの記述があります.

投稿2018/01/26 07:57

defghi1977

総合スコア4756

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

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

meesa

2018/01/26 08:08

おっしゃるとおり、returnを追加したところ意図したとおりに動きました! こんなに早く解決するとは思いませんでした。ありがとうございました。
guest

あなたの回答

tips

太字

斜体

打ち消し線

見出し

引用テキストの挿入

コードの挿入

リンクの挿入

リストの挿入

番号リストの挿入

表の挿入

水平線の挿入

プレビュー

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

ただいまの回答率
85.50%

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

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

質問する

関連した質問