dwz問題之動態生成的查詢帶回,點選沒有彈出彈框(動態生成的dom,點選不能彈出dialog)
阿新 • • 發佈:2019-02-20
一、問題
頁面通過點選事件,生成一個查詢帶回按鈕,點選這個按鈕,應該彈出彈框,實際上是頁面直接更換了連結。
二、原因
通過點選事件生成的按鈕,不能使用dwz的功能,原因是沒有繫結,需要再次繫結這些功能。
三、結果
在dwz的 dwz.ui.js 檔案中新增一個自定義的函式
/*
* ++ 自定義 再次初始dwz--lookup功能
*/
function reLookupGroup ( _box ) {
var $p = $(_box || document);
console.log( $p )
if ($.fn.lookup) $("a[lookupGroup]" , $p).lookup();
}
// 下面是 dwz 框架的原始碼
function initUI(_box){
var $p = $(_box || document);
$("div.panel", $p).jPanel();
然而,在頁面的點選生成查詢帶回的事件中,呼叫自定義的函式
$('button').click(function(){
var lookupGroupBtn = '<a class='btnLook' lookupGroup='paramsDefinition' width='1200' height='500' href='***/index'>查詢帶回</a>'
$("#paramsDefinition", navTab.getCurrentPanel()).append(lookupGroupBtn );
// 在js新增按鈕後,呼叫自定義功能
reLookupGroup();
});
四、類似
動態生成的dom節點,點選要出現dialog頁面,也不能出現,都是同樣的原理。在dwz.ui.js頁面寫一個函式,如:
/*
* ++ 自定義 再次初始dwz--dialog功能
*/
function reDialog_Dwz( _box ) {
var $p = $(_box || document);
$("a[target=dialog]" , $p).each(function() {
$(this).unbind('click');
});
$("a[target=dialog]", $p).each(function(){
$(this).click(function(event){
var $this = $(this);
var title = $this.attr("title") || $this.text();
var rel = $this.attr("rel") || "_blank";
var options = {};
var w = $this.attr("width");
var h = $this.attr("height");
if (w) options.width = w;
if (h) options.height = h;
options.max = eval($this.attr("max") || "false");
options.mask = eval($this.attr("mask") || "false");
options.maxable = eval($this.attr("maxable") || "true");
options.minable = eval($this.attr("minable") || "true");
options.fresh = eval($this.attr("fresh") || "true");
options.resizable = eval($this.attr("resizable") || "true");
options.drawable = eval($this.attr("drawable") || "true");
options.close = eval($this.attr("close") || "");
options.param = $this.attr("param") || "";
var url = unescape($this.attr("href")).replaceTmById($(event.target).parents(".unitBox:first"));
DWZ.debug(url);
if (!url.isFinishedTm()) {
alertMsg.error($this.attr("warn") || DWZ.msg("alertSelectMsg"));
return false;
}
$.pdialog.open(url, rel, title, options);
return false;
});
});
}
// 下面是 dwz 框架的原始碼
function initUI(_box){
var $p = $(_box || document);
$("div.panel", $p).jPanel();
……
使用,同生成查詢帶回按鈕一樣,在dom節點上新增後,呼叫自定義函式reDialog_Dwz()