Idea: Use window.showModalDialog method to get the reference to the pop-up subform, and then use window.returnValue="***" on the subpage to return the result.
Sample code: (simplified implementation with jQuery)
Parent page: parent.html
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><html xmlns="http://www.w3.org/1999/xhtml"><head><meta http-equiv="Content-Type" content="text/html; charset=utf-8" /><title>Parent page</title><mce:script language="javascript"><!-- function showmodal(){ var strReturn = window.showModalDialog("son.html",null,"dialogWidth:800px;dialogHeight:600px;help:no;status:no"); var s="You have selected:";for(var i=0;i<strReturn.length;i++){s+=strReturn[i]+",";}alert(s);}// --></mce:script></body></html>Subpage son.html
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><html xmlns="http://www.w3.org/1999/xhtml"><head><meta http-equiv="Content-Type" content="text/html; charset=utf-8" /><title>Subform</title><mce:script type="text/javascript" src="jquery-1.4.2.min.js" mce_src="jquery-1.4.2.min.js"></mce:script><mce:script type="text/javascript"><!--var result;$(function(){ $("#send").click(function(){ var result=new Array();$("[name=a]:checkbox:checked").each(function(){ result.push($(this).val()); }); window.returnValue=result; window.close(); }); });// --></mce:script></head><body><p><input type="checkbox" name="a" value="apple" />Apple<input type="checkbox" name="a" value="orange" />Orange<input type="checkbox" name="a" value="banana" />Banana<INPUT type="button" value="submit" id="send" /> </p></body></html>Summarize:
Parameter passing:
1. If you want to pass parameters in the dialog box, it is passed through vArguments. There is no restriction on type, for string types, the maximum is 4096 characters. Objects can also be passed, for example:
--------------------------------------------------------------------------------------------------------------------------------
parent.htm
<script> var obj = new Object(); obj.name="51js"; window.showModalDialog("son.htm",obj,"dialogWidth=200px;dialogHeight=100px");</script>son.htm
<script> var obj = window.dialogArguments alert("The parameter you pass is: " + obj.name)</script>2. You can return information to the window where the dialog box is opened through window.returnValue, and of course it can also be an object. For example:
parent.htm
<script> str =window.showModalDialog("son.htm",,"dialogWidth=200px;dialogHeight=100px"); alert(str);</script>son.htm
<script> window.returnValue="http://blog.csdn.net/a497785609";</script>
Extensions:
In .net, AJAX effects can be achieved in this way. When the child page passes the parameters to be selected, the parent page can implement the ICallbackEventHandler interface and directly pass the obtained value back to the server. Or use the UpdatePanel Load event to catch the passed parameters, so as to continue the server-side processing.
The above implementation code of JavaScript pop-up child form and returning the result to the parent form is all the content I have shared with you. I hope you can give you a reference and I hope you can support Wulin.com more.