複数のページを使用するdivがスローされるUncaught Error：初期化の前にダイアログのメソッドを呼び出すことができません。メソッド 'open'を呼び出そうとしました

Question

私は、このダイアログを2つの別々のページで使用しています。 Page1.aspxとPage2.aspx。どちらのページも、divがあるマスターページを使用します。 jsコードは独自のファイルです。すべてがPage1.aspxでうまく動作しますが、何らかの理由でPage2.aspx上でボタンをクリックすると、これが発生します。また、Page2.aspxでは、いくつかの未知の理由のテキスト領域がページに表示されます（これは、指定されたボタンがクリックされたときにポップアップdivにのみ表示される）ので、わからないことが起こっています。

エラー：

Uncaught Error: cannot call methods on dialog prior to initialization; attempted to call method 'open' 
    at Function.error (https://code.jquery.com/jquery-1.12.4.js:253:9) 
    at HTMLDivElement.<anonymous> (https://code.jquery.com/ui/1.12.1/jquery-ui.js:246:16) 
    at Function.each (https://code.jquery.com/jquery-1.12.4.js:370:19) 
    at jQuery.fn.init.each (https://code.jquery.com/jquery-1.12.4.js:137:17) 
    at jQuery.fn.init.$.fn.(anonymous function) [as dialog] (https://code.jquery.com/ui/1.12.1/jquery-ui.js:236:10) 
    at HTMLAnchorElement.<anonymous> (http://23.97.29.252/webapp/js/CommentModal.js:47:29) 
    at HTMLAnchorElement.dispatch (https://code.jquery.com/jquery-1.12.4.js:5226:27) 
    at HTMLAnchorElement.elemData.handle (https://code.jquery.com/jquery-1.12.4.js:4878:28) 

本部HTMLコード：

<div id="commentDialog" title="Comment"> 
    <textarea id="commentTextArea" style="resize: none" rows="8" cols="42" disabled="disabled"></textarea> 
</div> 

JSコード：

$(document).ready(function() 
{ 
    $('#commentDialog').dialog({ 
     'buttons': { 
      'Save': { 
       id: 'commentSave', 
       text: 'Save', 
       click: function() { 
        //Save to DB with Web API 
       } 
      }, 
      'Edit': { 
       id: 'commentEdit', 
       text: 'Edit', 
       click: function() 
       { 
        $('textarea#commentTextArea').removeAttr("disabled"); 
        $('#commentEdit').hide(); 
        $('#commentSave').show(); 
       } 
      }, 
      'Cancel': { 
       text: 'Cancel', 
       click: function() 
       { 
        $('#commentEdit').show(); 
        $('#commentSave').hide(); 
        $(this).dialog("close"); 
       } 
      } 
     }, 
     autoOpen: false, 
     height: 300, 
     width: 350, 
     modal: true 
    }); 

    $('button#commentSave').hide(); 

    $('[id^=CommentButton]').click(function (e) 
    { 
     e.preventDefault(); 
     $("#commentDialog").dialog("open"); 
    }); 

}); 

Answer 1

あなたは、ダイアログを作成する必要があります最初。試してみてください：

$("#commentDialog").dialog().open();