在Primefaces上,在DialogFramework中,如何拦截<p:dialog> CLOSE事件并停止它



如何在完全关闭dialogframework窗口之前拦截"关闭"事件,以允许用户停止对话框的关闭。

使用jQuery,我试图在标签上拦截" OnClick"(或" Mousedown"(事件,该事件似乎代表了TitleBar中显示的关闭按钮。我在标签上尝试了同样的事情。

我还尝试更改标签的" href =#"属性,但没有成功。

如何解决此问题?

下面您可以找到FSF/PrimeFaces生成的HTML代码

<div id="FormSession:j_idt272:0:CtcActionTable:0:j_idt281_dlg" 
     class="ui-dialog ui-widget ui-widget-content ui-corner-all ui-shadow ui-hidden-container ui-draggable ui-resizable ui-overlay-visible" 
     role="dialog" 
     >
  <div class="ui-dialog-titlebar ui-widget-header ui-helper-clearfix ui-corner-top ui-draggable-handle">
    <span class="ui-dialog-title">CTC input: 82020</span>
      <a class="ui-dialog-titlebar-icon ui-dialog-titlebar-close ui-corner-all" href="#" role="button">
        <span class="ui-icon ui-icon-closethick"></span>
      </a>
  </div>

及以下,您可以找到我已经测试过的jQuery((指令。

 function onLoadDialog()
 {
 jQuery(".ui-dialog-titlebar-close").attr("href", "?");
 jQuery(".ui-icon-closethick").click(function(e)    
     {
     alert("onclick");        
     return false;            
     });    
 jQuery(".ui-icon-closethick").click(function(e)    
     {
     alert("onclick");        
     return false;            
     });    
 jQuery(".ui-icon-closethick").mousedown(function(e)    
     {
     alert("mousedown");        
     return false;            
     });    
 jQuery(".ui-dialog-titlebar-close").mousedown(function(e)
     {
     alert("mousedown");        
     return false;            
     });    
 jQuery(".ui-dialog-titlebar-close").click(function(e)    
     {
     alert("onclick");        
     return false;            
     });    

下面的代码是解决方案。

var wgDialog 
    = jQuery(".ui-dialog.ui-overlay-visible",window.parent.document)
      .each
        (function(nIndex)
            {
            //var sId = $(this).attr('id');
            //var sNodeName = $(this).prop('nodeName');
            //var sClass = $(this).attr('class');
            var sWidgetName = $(this).attr('data-widgetvar');
            var wgDialog = window.parent.PF(sWidgetName);
            wgDialog.hide = function()
                {
                alert("OnHide()");    
                this.jq.hide();
                }
            });

首先,在PrimeFaces上,我们在创建DialogFramework时没有可能给出widgetVarname。这就是为什么很难获得小部件的主要原因。

您必须知道PrimeFaces DialogFramework Widget有2个其他对话框的细节类别:那就是" UI-Dialog"one_answers" .Ui-overlay-visible"。

此代码的第一部分是搜索dialogframework jquery widtget。

var wgDialog 
    = jQuery(".ui-dialog.ui-overlay-visible",window.parent.document)
      .each
        (function(nIndex)

警告:在执行代码的同一浏览器窗口中未定义dialogframework小部件。该代码是在iframe窗口中执行的,但是小部件是在他的父窗口中定义的!这解释了jQuery的第二个参数,即" window.parent.document"。

我从" data-widgetvar"属性中获取PrimeFaces名称,PrimeFaces已在浏览器上显示的XHTML文件中表示DialogFramework。

var sWidgetName = $(this).attr('data-widgetvar');

因此,当我有这个名字时,我可以使用pf((函数轻松找到窗口小部件。

var wgDialog = window.parent.PF(sWidgetName);

现在我有了小部件,我可以"覆盖" primefaces.widget.dialog.hide((函数。

wgDialog.hide 
    = function()
        {
        alert("OnHide()");    
        this.jq.hide();
        }

我显示一条消息,以查看我的代码工作,并调用hide((方法有效地关闭对话框。

感谢Kukeltje的帮助。

最新更新