在应用中,弹出式窗口选择数据,这种解决方案是很普遍的。
弹出窗口,有两种方式,一种是:showModalDialog,使用模式窗口,这种方式的好处有两个地方,一、可以直接返回数据,二、在最前面显示,避免用户误操作,窗口被遮蔽。
但是这种方式个人感觉比较致命的地方就是因为这个是一个对话框,在form提交的时候只能新开一个页面(可能我没有发现其他的方式)。但是也有其他的方式,如加iframe,但是这样感觉页面太烦了,需要两个页面才能实现,比较麻烦。
第二种:window.open,这种方式也有一个问题,就是会被当做广告拦截掉,还算不是很致命。
我的方案就是这个,下面上代码。
传递格式通过json,这样我可以自己定义需要回填那些域,返回值这边就是竟可能的完整。


/**//*
弹出窗口
endtarget: string 目标窗口
无返回
*/

function fopenWindow(endtarget)
{
window.open( endtarget, "", "left=0, top=0, width=800px, height=600px, scrollbars=1, resizable=1, menubar=0, location=0, status=0, toolbar=0, " );
}


/**//*
window.open的回调函数
根据传入的json格式,赋值相应的域值

cmp:string 域id
retval :json 所选行的数据
无返回
*/

function fopenCallback(cmp, retval)
{
//alert("call back start." + cmp);
var obj = eval('(' + cmp + ')');

for(var e in obj )
{
//alert(obj[e]);
document.getElementById(obj[e]).value = retval[obj[e]]
}
}

window.openCallback = fopenCallback;


/**//*
获取url上的参数
返回:key value 对
*/
function GetUrlParms()


{
var args=new Object();
var query=location.search.substring(1);//获取查询串
var pairs=query.split("&");//在逗号处断开
for(var i=0;i<pairs.length;i++)

{
var pos=pairs[i].indexOf('=');//查找name=value
if(pos==-1) continue;//如果没有找到就跳过
var argname=pairs[i].substring(0,pos);//提取name
var value=pairs[i].substring(pos+1);//提取value
args[argname]=unescape(value);//存为属性
}
return args;
}


/**//*
行双击方法,用户选择行数据。
通过回调函数,完成赋值,最后关闭窗口
rtnval: string 行数据
*/
function Dialog_onDblClick(rtnval)


{
//var rtnval = {prodId: prodId, prodName: prodName};
var args = new Object();
args = GetUrlParms();
var cmp = args['cmp']
window.opener.openCallback(cmp, rtnval);
window.close();
}
主页面 域id通过json字符串跟url传递后弹出页面
function popProductDialog(){
var endtarget = "<%=path%>/bas/product.do?method=dialog";
var cmp = "{a: 'prodId', b: 'prodName'}";
//fshowModalDialog(endtarget, cmp);
fopenWindow(endtarget+ "&cmp=" + cmp);
}
弹出框
function Document_onDblClick(value1,value2)

{

var rtnval = {clientId:value1, clientName:value2};
Dialog_onDblClick(rtnval);

}
弹出页面解析获得域id,并通过循环域id从返回值中获取数据,并进行赋值。
这里唯一需要变的就是,弹出页面的返回值,可能因为需求的增加,需要返回更多的数据,或者就一次性将所有数据都作为json数据返回。
这样客户在调用的时候,只要域id不超出返回字段的范围,就可以正确使用了。