2012-07-18 159 views
1

這個問題似乎非常普遍,經過研究並嘗試所有建議的解決方案,這些解決方案對其他人來說都不適合我。要添加,螢火蟲也不會顯示任何錯誤。Jquery對話框關閉按鈕不關閉;對話框只能打開一次

我正在使用Jquery模式對話框。該對話框將通過網格欄上的鏈接打開。 問題是它只打開一次,關閉按鈕沒有關閉對話框,但是我可以用右上角的(X)關閉它。但是,在試圖重新打開不同列值的對話框時,不會打開對話框(儘管服務器端操作類會被執行)..請幫助。

相關的代碼: 父頁(JSP)

<s:url id="testurl" action="openView"/> 
<script type="text/javascript"> 
$(function(){ 
    $("#dialogOne").dialog({ 
     autoOpen: false, 
     title: 'Details', 
     modal:true, 
     width:970, 
     buttons: { "Close": function() { $(this).dialog("close"); } }, 
     open: function(event, ui) { $(".ui-dialog-titlebar-close").show(); } 
     }); 

});

function formatLink(cellvalue, options, rowObject) { 
            return "<a href='#' onClick='javascript:openDialog("+cellvalue+");return false;'>" + cellvalue + "</a>"; 
            } 
           function openDialog(number) { 
            $("#dialogOne").load("<s:property value="testurl"/>?Number="+number); 
            $("#dialogOne").dialog('open'); 
           }  

相關表格列:

<sjg:gridColumn 
              name="number" 
              index="nsNumber" 
              title="View Action" 
              formatter="formatLink" 
              sortable="false" 
              width="80" 

            /> 

我已經試過了AJAX的解決方案,以及文件準備建議的變化和它沒有工作。動作openView返回一個jsp,並且我確保該頁面上的div ID全都是唯一的,如果這有什麼區別的話。 Firebug不顯示任何錯誤。對話框只打開一次,無法通過對話框關閉按鈕關閉。並且,之後不能打開(/重新打開)對話框。

謝謝

回答

0

我認爲這是您的腳本配置的問題。事件處理程序未正確初始化,因此事件未按預期執行。

通常你會想在加載頁面的時候初始化這些頁面,並且我的包處理函數在$(document).ready()函數中取得了最大的成功。除此之外,您使用的onClick方法也是可疑的。如果您使用的是jQuery,最好避免將onClick分配給標籤本身。通過使用jQuery及其綁定機制,您可以避免動態頁面元素在事件處理程序方面無法按預期運行的問題。

function formatLink(cellvalue, options, rowObject) { 
      return "<a href='#' class='dialogLink' data-cell='cellvalue'>" + cellvalue + "</a>"; 
     } 

$(document).ready(Function(){ 

     $("#dialogOne").dialog({ 
      autoOpen: false, 
      title: 'Details', 
      modal:true, 
      width:970, 
      buttons: { "Close": function() { $(this).dialog("close"); } }, 
      open: function(event, ui) { $(".ui-dialog-titlebar-close").show(); } 
     }); 

     // This will bind the event handler to any link with this class. The data 
     // attribute is used to set/get the cellvalue from the link that is clicked. 
     $('.dialogLink').on('click', function(){ 
      var number = $(this).data('cell'); 
      $("#dialogOne").load("<s:property value="testurl"/>?Number="+number); 
      $("#dialogOne").dialog('open'); 
     }); 

    });