のjQuery UIのダイアログの問題 - ファントム閉じるボタンやハイパーリンクダイアログが

Question

をレンダリングする前に、私は次のように編集フォームを開くためのjQuery UIのダイアログを使用しています：

$('.btnEdit').click(function(e){ 
     var myID = e.target.id; 
     var arrMyID = myID.split('_'); 
     var myRecID = arrMyID[1]; 
     var myUrl = "editSubmissionModal.cfm?recID=" + myRecID; 

     $("#divEdit").dialog({ 
      width: '1200', 
      position: { my: "center", at: "top", of: window }, 
      autoOpen: false, 
      modal: true, 
      close: function(e, ui) { 
      $('#divEdit').html(''); 
      $('#divEdit').hide(); 
      $('#divMain').show(); 
      }   
     });               

     $('#divEdit').load(myUrl); 
     $('#divMain').hide(); 
     $('#divEdit').dialog('open'); 
     $('#divEdit').show(); 
    }); 

私がしてきた物事のカップルがあります。と闘う。私はbtnEditクラスを持つ要素がクリックされるたびにダイアログを初期化しています。このイベントハンドラの外側で初期化すると、ダイアログは最初にクリックされたときにのみ起動します。私はこの問題に関するいくつかの記事を見てきましたが、すべてautoOpenをfalseに設定することを指摘しています（それは解決策です）。私がやったことは、私が見た他の例とは矛盾していますが、それを働かせる唯一の方法です。

2番目の問題（そして私が解決しなければならない問題）は、ダイアログが完全に読み込まれる前にイベントが発生した最初のときに、画面に表示される閉じるボタンのように見えます。これは、ダイアログフォームが表示される前です。閉じるボタンのように見えます。その後、ボタンの代わりに、ハイパーリンクとして閉じるという単語が最初に表示されます。ダイアログのロードが終了すると、ボタン（またはハイパーリンク）が消えます。

私はこれを試しました：$（ ".ui-dialog-titlebar-close"）。hide（） ファントムクローズを取り除きますが、右上の「X」を隠します。ダイアログボックスも同様です。これは私が必要です。何か案は？この投稿への

Answer 1

ありがとう：load external URL into modal jquery ui dialog

は、私はそれがこのように作業があります。

$('.btnEdit').click(function(e){ 
      var myID = e.target.id; 
      var arrMyID = myID.split('_'); 
      var myRecID = arrMyID[1]; 
      var myUrl = "editSubmissionModal.cfm?recID=" + myRecID; 
      openDialog(myUrl, myRecID); 
    }); 

    function openDialog(myUrl, myRecID) { 
      var $dialog = $('#divEdit') 
       .html('<iframe id="myIframe" style="border: 0px; background-color:white;" src="' + myUrl + '" width="100%" height="100%"></iframe>') 
       .dialog({ 
        title: "Request ID: " + myRecID, 
        autoOpen: false, 
        modal: true, 
        width: '1400', 
        height: '1400', 
        position: { my: "center", at: "top", of: window }, 
        draggable:true, 
        open: function(){ 
         $('#divMain').hide(); 
        }, 
        close: function(e, ui) { 
         $('#divEdit').html(''); 
         $('#divEdit').hide(); 
         $('#divMain').show(); 
        }        
       }); 
      $dialog.dialog('open'); 
    }