MasterページのMenu押下時に確認メッセージを出力したい。

Question

以下の環境でWebアプリケーションの開発をしております。

・VisualStudio2008Dev

・.net Framework 3.5 SP1

・C#

マスターページにsiteMapをバインドしたasp：Menuをが配置してあります。

子ページに一覧（SPREAD）があり、その一覧のデータを変更した後に保存ボタンを押下したら、DBへ更新するといった処理です。

現在やりたいことは一覧を変更したのに保存ボタンを押下せず、メニューから別ページに遷移しようとした場合、

javascriptで「保存してないけどいいですか？」のようなコンファームを出力し、OKで遷移、キャンセルでそのまま。としたいです。

 

上記処理は実現可能でしょうか？

ご教授よろしくお願い致します。

 

 

 

Answer 1

可能です。ASP.NETとは無関係のHTML+JSのみのやり方になります。概要だけ書きますと、

• body 要素にonunloadイベントを置くと、他ページへの遷移の直前で割り込めます。このときreturn false;することで遷移を阻止できます。
• コンファームを出すのでむしろ、return confirm('保存してないけどいいですか？'); ですね。
• 変更済みかどうかは、ページ内にjavascriptのグローバル変数を一個置いて、なにか変更があったときにtrueにするとかすればいいでしょう。
• 変更があったことを検知して、そのグローバル変数に書き込むために、すべての入力コントロールにonchangeを設置する必要があります。ラジオボタンなんかにはonclickです。

Answer 2

miuras_net様

ご回答ありがとうございます。

onunloadイベントでコンファームを出力することはできたのですが、

コンファームの「OK」「キャンセル」どちらを押下しても

画面が遷移してしまうようです。

また、画面のポストバック時に常にコンファームが表示されてしまいました・・。

Masterページが関連しているのでしょうか・・。

勉強不足で申し訳ないのですが、

なにかアドバイスをいただけたら幸いです。

Answer 3

すみません、onunloadではなくonbeforeunloadでした。

ですが、ちょっと調べ直してみたところこのonbeforeunloadは非標準でブラウザ依存してしまうんですね。これは具合が悪い…

遷移阻止の標準的な方法というものはなく、もし本気でやろうとしたらブラウザごとに分岐してごちゃごちゃやる必要があるようです。

ポストバック時にもダイアログが出てしまう件は、更新ボタンのonClientClickに変更検知グローバル変数をクリアするコードを一行書いてあげれば問題なくなると思います。

Answer 4

miuras_net様

ご回答ありがとうございます。

 

window.onbeforeunload = function(event) {

        event = event || window.event;

        event.returnValue = '保存が行われていませんがよろしいですか?';

}

としたら希望の動作になりました！

onbeforeunloadイベントでググるとたくさん情報がでてきましたね。。。

asp：Menuコントロールがあったため、変なところを調査しておりました。お恥ずかしいです。

ちなみに今回のアプリはIE限定なので、問題ないと思われます。