jQueryダイアログを2回呼び出す

Question

私は2つの関数：myFunc1とmyFunc2を持っています。 myFunc1が呼び出されると、jQuery confirmation Dialogが表示されます。ユーザーが「はい」をクリックすると、myFunc2が呼び出され、別のダイアログが表示されます。
しかし、myFunc2の呼び出しに成功したにもかかわらず、2番目のダイアログは表示されません。

Here is a fiddle。

function myFunc1() { 
    dialog().then(function(data) { 
    if (data == "yes") { 
     console.log("clicked yes: show another dialog") 
     myFunc2(); 
    } else { 
     console.log("clicked no") 
    } 
    }); 
} 

function myFunc2() { 
    dialog(); 
    console.log("myFunc2 is called") 
} 

function dialog(title) { 
    var def = $.Deferred(); 
    $("#dialog").dialog({ 
    modal: true, 
    buttons: { 
     "Yes": function() { 
     def.resolve("yes"); 
     $(this).dialog("close"); 
     }, 
     "No": function() { 
     def.resolve("no"); 
     $(this).dialog("close"); 
     } 
    } 
    }); 
    return def.promise(); 
} 

$("button").on("click", myFunc1); 

Answer 1

実際に最初のダイアログを閉じる前に、Deffered-Objectを解決しています。したがって、then() -callbackがヒットした場合、ダイアログは開いたままなので、新しいダイアログは作成されません。

機能を入れ替えるだけで機能するはずです。

Example

解決される繰延

"Yes": function() { 
    $(this).dialog("close"); 
    def.resolve("yes");   
}, 

、deferred.then（）またはdeferred.done（）によって追加された任意doneCallbacksが呼び出されます。コールバックが順番に実行されている彼らは、あなたはそれが問題になり、一度に複数のダイアログオープンを持っている必要がある場合は、すべてのダイアログを作成するために、同じdiv要素を使用している

.resolve()

Answer 2

を追加しました。また

// Get a random unique number to use as the dialog id 
var guid = Math.floor(Math.random() * 9999999999999) + 1; 
// Clone the dialog div and give it a new name 
$("#dialog").clone()[0].id = guid; 
// Create the dialog with the new unique div 
$("#"+guid).dialog({...}); 

、

// Make sure you remove the div after you close it 
$(this).dialog("close").remove();