2012-07-18 223 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'); 
     }); 

    });