jquery ui dialogないでajaxを実行したい

Question

■現在の状況
ajax通信をjquery UIのdialog内で実行しています。
dialog内のボタンを押すと通信が実行されます。

①dialogのボタンをクリック
②dialogを閉じる
③ajax通信を開始

の順番で実行したいと考えています。

現状は
①dialogのボタンをクリック
②ajax通信を開始
③dialogを閉じる

の順番で実行されます。

jquery UI dialogの中でajaxを行うのが問題なのでしょうか？
dialogのボタンを押してajax通信を行うとして他に解決策があればご教授願います。

[.js]
 $('#dialog').dialog({
      
        buttons:[
            '実行': function() {
                             $.ajax(
                                 url: '..,
                                 type: 'post',
                                 data: formData,
                                 processData: false,
                                 contentType: false,
                                 async: false,
                                 dataType: 'json',
                                 mimeType: "multipart/form-data",
                                 beforeSend: function () {
                                                       $('#processing-dialog').dialog('open')
                                                    },
                              });
                    },
});
  

Answer 1

ajaxのbeforeSend内でダイアログ閉じればいいんじゃね。

Comments

[退会済みユーザー]

回答ありがとうございます。
なるほど！
beforeSend内で実行してみます！
ありがとうございます！

[退会済みユーザー]

beforeSend内で試してみたのですが実行結果は同じとなりました。
dialogを閉じるイベントの直後にalertを発生させるとdialogが消えました。

初心者なので実行順序や仕組みをよく理解できていない為、実際はできるのにイベントが上手く連鎖できていないのかとも思いました。
(初心者の為、用語の使い方に不備がございましたら申し訳ありません。)

別のアプローチを思いつきましたら自己解決方法を更新しようと思います。
この度は回答していただきありがとうございました！

Answer 2

クリックしたタイミングで実行するコードとダイアログを閉じてから実行したいって凄く矛盾されていませんか？closeメソッドに対して発火させればいいのではないでしょうか

Comments

[退会済みユーザー]

回答ありがとうございます。
やっぱり矛盾していると思いました。
closeメソッドで試してみます！
ありがとうございます！

[退会済みユーザー]

closeメソッドで試してみたのですが実行結果は同じとなりました。
やはり実行手順が矛盾しているかなと思い別のアプローチ方法を模索中です。

別のアプローチを思いつきましたら自己解決方法を更新しようと思います。
回答していただきありがとうございました！