jQuery UIのDialogを使い、確認ダイアログをいい感じに実装する

課題

フォームを登録する前など、何らかの処理を行う前に確認ダイアログを出したいケースはよくあります。
その際、jQuery UIのDialogを使い実装すると大体以下のような感じになると思います。

register.js

	//登録ボタン押下時
	$("#register").click(function () {
            //確認ダイアログを表示
            $('#confirm').dialog('open');
	});

	//確認ダイアログ
	$("#confirm").dialog({
		buttons : {
			"OK" : function() {
    				//バリデーションなどの登録前処理
                     
    				//フォームを送信
    				$('form').submit();
			},
			"キャンセル" : function() {
				//キャンセル時処理
			}
		}
	});

しかしこのような実装方法だと、登録前処理や登録後処理を登録ボタン押下時のイベント下に記述できず、確認ダイアログのイベント下に登録処理を記述しなくてはならないため見通しが悪くなってしまいます。
また引数なども素直に渡すことができないため工夫する必要がありました。

対応策

jQuery.Deferredを使い以下のような拡張プラグインを作成しました。

jquery-ui-dialog-extend.js

(function($) {
	$.confirm_jquery_ui_dialog = function(options) {
		var setting = $.extend({
			msg: '',
			dialog_id: '',
			ok_word: 'OK',
			cancel_word: 'キャンセル',
		}, options||{});

		if(setting.dialog_id == ''){
			throw "do not set dialog_id";
		}

		var d = new $.Deferred;
		var buttons = [
			{
				text: setting.ok_word,//OKボタン押下時
				click: function() {
					$(this).dialog('close');
					d.resolve();
				}
			},
			{
				text: setting.cancel_word,//キャンセルボタン押下時
				click: function() {
					$(this).dialog('close');
					d.reject();
				}
			},

		];

		$(setting.dialog_id).dialog({
			buttons : buttons,
		});

		$(setting.dialog_id).text(setting.msg);
		$(setting.dialog_id).dialog('open');
		return d.promise();
	};
})(jQuery);

register.js

        //登録ボタン押下時
	$("#register").click(function () {
		$.confirm_jquery_ui_dialog({
			msg: "登録しますか？",
			dialog_id: "#confirm",
		}).done(function(){
				//バリデーションなどの登録前処理
                     
				//フォームを送信
				$('form').submit();
		}).fail(function(e){
			//キャンセル時処理
		}).always(function(){
			//OKボタン押下時とキャンセルボタン押下時の共通処理
		});
	});

こうすることで登録ボタン押下時のイベント下に素直に登録処理を記述できるので、見通しがよくスッキリとした形になりました。
以上参考までに。