オブジェクトがプロパティまたはメソッド 'ダイアログ'をサポートしていません

Question

私のアプリケーションでjqueryを使用してモーダルダイアログを実装しようとしています。ボタンをクリックすると、Webページ（URL）を表示するためのモーダルダイアログが表示されます。しかし、私はJavaScriptのランタイムエラーが発生し続けています：

Object doesn't support property or method "dialog" error in the line $("#dialog").dialog("open") .

私はすでに私のアプリケーションにこれらのjqueryスクリプトを含めています。私はjquery-ui-1.12.1.zipのスクリプトを使用しています。 参考のために私のコードです。

<script src="Scripts/jquery.js" type="text/javascript"></script> 
<script src="Scripts/jquery-ui.min.js" type="text/javascript"></script> 
<script src="Scripts/jquery-ui.js" type="text/javascript"></script> 

<script> 
     $(document).ready(function() { 
      $("#btnProdHierarchy").click(function() { 
       $("#dialog").load(PMASTERLINK, function() { 
        $("#dialog").dialog("open"); 
        return false; 
       } 
       ) 
      }) 
     }); 
</script> 


<div id="dialog" title="Basic dialog"></div> 
<input id="btnProdHierarchy" type="button" value="Product Master" accesskey="H" /> 

この問題を解決するために私に手を差し伸べてください。ありがとう！

Answer 1

これが私の仕事：

<script src="https://code.jquery.com/jquery-3.2.1.min.js" type="text/javascript"></script> 
<script src="https://code.jquery.com/ui/1.12.1/jquery-ui.min.js" type="text/javascript"></script> 

<script> 
    $(document).ready(function() { 
     $("#btnProdHierarchy").click(function() { 
      $("#dialog").load(PMASTERLINK, function() { 
       $("#dialog").dialog().dialog("open"); 
       return false; 
      }) 
     }) 
    }); 
</script> 


<div id="dialog" title="Basic dialog"></div> 
<input id="btnProdHierarchy" type="button" value="Product Master" accesskey="H" /> 

を私は明らかに、何か他のものでPMASTERLINKを置き換えます。

Answer 2

ダイアログロードが正しくありません。 jquery-uiのドキュメントを先に読んでみてください。あなたのコードでも "PMASTERLINK"は定義されていません！それ

$("#dialogBtn").on("click", function() { 
    $("#dialog").dialog("open"); 
}); 

のthats：

$("#dialog").dialog({ 
    autoOpen: false,  
}); 

と、ボタンは次のようにする必要があります：

ダイアログは次のように定義する必要があります！

HTML：

<div id="dialog" title="Basic dialog"> 
<p>Your Dialog Text</p> 
</div> 

<button id="dialogBtn">Open Dialog</button> 

例：https://jsfiddle.net/emilvr/ebgkmw79/1/