jQuery/UIのダイアログでダイアログ（ "オープン"）コールをブロックするには

Question

モーダルダイアログを表示する関数を作成しようとしています。ダイアログが閉じられるまでブロックを呼び出すと、呼び出し元に返す

次の機能は2つの問題があります。

1. ダイアログが開いている間に結果を返します。
2. セレクタテストでダイアログが見つからない場合、ダイアログボックスの作成後に、id要素が失われていることがFirebugで検査されます。

。

function getCountrySelection() { 
    var ctryCode; 
    var dlg = $("#JS-field-dlg-ctry-select"); 

    if (dlg.size() === 0) { 
     dlg = $("<div id='JS-field-dlg-ctry-select' title='Select Country' class='dialog-fields'></div>"); 
     dlg.append("Customer found in both Australia and New Zealand"); 
     dlg.dialog({ 
      autoOpen: false, 
      width: 400, 
      height: 160, 
      modal: true, 

      buttons: { 
       "Australia": function() { 
        ctryCode = "au"; 
        $(this).dialog("close"); 
       }, 
       "New Zealand": function() { 
        ctryCode = "nz"; 
        $(this).dialog("close"); 
       }, 
       "Cancel": function() { 
        $(this).dialog("close"); 
       } 
      } 
     }); 
    } 

    dlg.dialog('open'); 

    return ctryCode; 
} 

EDIT：私は私がこれを呼んでいる方法を示したいと思った：

buttons: { 
    "Find": function() { 
     var custAu = JS.sales.getCustomer("au", inpCust.val()); 
     var custNz = JS.sales.getCustomer("nz", inpCust.val()); 

     var cust; 
     if (custAu === undefined && custNz === undefined) { 
      alert('No customer could be found with that number.'); 
      return; 
     } else if (custAu !== undefined && custNz !== undefined) { 
      var ctry; 
      getCountrySelection(function(result) { 
       ct = result; 
      }); 
      if (ctry === "au") { 
       cust = custAu; 
      } else if (ctry === "nz") { 
       cust = custNz; 
      } else { 
       return; 
      } 
     } else if (custNz === undefined) { 
      cust = custAu; 
     } else { 
      cust = custNz; 
     } 

     if (cust) { 
      $(this).dialog("close"); 
      // Do something with cust. 
     } else { 
      alert('Customer could not be found.'); 
     } 
    }, 
    "Cancel": function() { 
     $(this).dialog("close"); 
    } 
} 

Answer 1

ダイアログ閉じるまで実行をブロックする方法はありません。 JavaScriptでは、実行を「中断」することはできません。あなたの最善の策はあなたの機能の契約を変更することです。直ちに値を返すのではなく、ダイアログを閉じるとすぐに結果とともに呼び出すコールバック関数を受け入れる必要があります。これを呼び出すコードは、実行を継続できる適切なコールバックを提供します。このような

何か：

function getCountrySelection(callback) { 
(...) 
      buttons: { 
       "Australia": function() { 
        $(this).dialog("close"); 
        callback("au"); 
       }, 
       "New Zealand": function() { 
        $(this).dialog("close"); 
        callback("nz"); 
       }, 
       "Cancel": function() { 
        $(this).dialog("close"); 
        callback(); 
       } 
      } 
     }); 
    } 
    dlg.dialog('open'); 
} 

が続いて使用します。

getCountrySelection(function(result) { 
    if (result) { 
     ...handle result... 
    } else { 
     ...the user cancelled the dialog... 
    } 
}); 

これは、基本的にはAJAX呼び出しと同じものです。 AJAXが実際に完了して結果を返すまで待機するようにAJAX呼び出しを「中断」することはできません。したがって、「非同期」です。

EDIT：あなたの具体的な例では、あなたはこのようにそれを使用することができます：あなたは、ブラウザのJavaScriptでそれを行うことはできません

buttons: { 
    "Find": function() { 
     var custAu = JS.sales.getCustomer("au", inpCust.val()); 
     var custNz = JS.sales.getCustomer("nz", inpCust.val()); 

     if (custAu === undefined && custNz === undefined) { 
      alert('No customer could be found with that number.'); 
      return; 
     } else if (custAu !== undefined && custNz !== undefined) { 
      getCountrySelection(function(ctry) { 
       var cust; 
       if (ctry === "au") { 
        cust = custAu; 
       } else if (ctry === "nz") { 
        cust = custNz; 
       } 
       handleCustomer(cust); 
      }); 
     } else if (custNz === undefined) { 
      handleCustomer(custAu); 
     } else { 
      handleCustomer(custNz); 
     } 

     function handleCustomer(cust) { 
      if (cust) { 
       $(this).dialog("close"); 
       // Do something with cust. 
      } else { 
       alert('Customer could not be found.'); 
      }    
     } 
    }, 
    "Cancel": function() { 
     $(this).dialog("close"); 
    } 
}