使用javascript showModalDialog将值从父窗体传递到子窗体

时间:2009-09-29 02:28:51

标签: javascript

如果我想传递我的价值确认框!!!所以我想说我要删除1号项目,所以当我按下删除按钮时,我选中了复选框。弹出框中出现了详细的第1项。

我使用show modal对话框(JavaScript)实现了弹出窗口,但我仍然无法将父值转换为子窗体!

此外,如果我有1号项目和2号项目,我希望两者都显示在确认框中!!

任何建议都会非常感激你!!!

3 个答案:

答案 0 :(得分:1)

showModalDialog的中间参数可以是对象或数组,也可以是您喜欢的任何内容,并且可以通过引用window.dialogArguments在子表单中(例如,在其OnLoad事件中)检索此传递的对象。

暂停一下,我将包含一个代码示例(自我完成此操作以来已经过了大约10年)。

更新:这是一个非常简单的代码示例,它显示了使用showModalDialog在父窗口和子窗口之间来回传递数据的基础知识。在同一文件夹中创建两个HTML文件,并将它们命名为“Parent.htm”和“Child.htm”。将此代码放在 Parent.htm

<HTML>
<input type=button value="CustomConfirm" 
    onclick="ShowMyDialog()">
<script language="javascript">
function ShowMyDialog()
{
    var obj = new Object(); 
    obj.data1 = 'some data 1';
    obj.data2 = 'some data 2';
    showModalDialog('Child.htm', obj, '');
    alert(obj.returnvalue);
}
</script>
</HTML>

并将此代码放在 Child.htm

<HTML>
<body onload="ReadPassedData()" 
    onunload="DoUnload()">
<input type=text id="textbox1">
<br>
<input type=text id="textbox2">
<br>
<br>
Return value:<br>
<input type=text id="textbox3" 
    value="type something">
</body>
<script language="javascript">
function ReadPassedData()
{
    var obj = window.dialogArguments;
    var tb1 = document.getElementById('textbox1');
    tb1.value = obj.data1; 
    var tb2 = document.getElementById('textbox2');
    tb2.value = obj.data2; 
}
function DoUnload()
{
    var obj = window.dialogArguments;
    obj.returnvalue = textbox3.value;
}
</script>
</HTML>

然后在浏览器中打开Parent.htm并单击“CustomConfirm”按钮。子窗口将显示在父窗口中设置的值(“某些数据1”和“某些数据2”),当子窗口关闭时,您在第三个文本框中输入的任何内容都将显示在警报中从父母调用的框。这显示了将数据传递给子节点并从中获取数据的基本方法。

还有一种方法可以从子窗口返回一个对象(它变成了从showModalDialog调用本身返回的值),但我不记得如何执行此操作。

更新2 :要改为传递数组,您可以执行以下操作:

var myarray = new Array();
myarray[0] = "Bob Smith";
myarray[1] = "Doug Jones";
myarray[2] = "Englebert Humperdinck";
var ret = showModalDialog('Child.htm', myarray, '');
alert(ret); // this will display whatever the child set for its
    // window.returnValue

然后在子窗口中,您将像以前一样获取数组并使用它来构建您的详细信息显示:

var myarray = window.dialogArguments;
alert(myarray[0]); // or whatever

由于您现在传入的是数组而不是对象,因此您需要返回true或false(而不是向传递的对象添加returnvalue属性)。您可以通过设置window.returnValue属性来设置子项中的返回值。由于您正在创建确认弹出窗口,因此您可能会有一个“是”和“取消”按钮,分别将window.returnValue设置为truefalse

答案 1 :(得分:1)

如果您使用的是弹出窗口,则可以像这样引用父级:

window.opener.document.getElementById("whatever").value = whatever;

答案 2 :(得分:0)

假设我们有一个WindowTrigger.aspx,它包含一个如下所示的按钮,它调用以下脚本并执行,并使用showModalDialog打开新页面WindowContainer.aspx。

     <asp:Button ID="btnDate" Text="Display Window" OnClientClick="WindowOpen()"       runat="server" />

<script language="javascript" type="text/javascript">
         function WindowOpen() {
             var theAdmin = new Array();
             theAdmin["id"] = '';
             theAdmin["name"] = '';
             var winopts = "dialogWidth:290px;dialogHeight:220px;scroll:no;resizable:no;status:no;unadorned:yes";

             var admStatus = window.showModalDialog("http://localhost:51836/WindowContainer.aspx", theAdmin, winopts);
             alert(theAdmin["id"]);
             alert(theAdmin["name"]);
         }
     </script> 

上面的脚本包含数组声明'theAdmin',它使用第二个参数传递给子窗口,如图所示

以下代码位于WindowContainer.aspx中,其中包含一个列表框和一个按钮,点击按钮后,参数将初始化为相应的选定文本和列表框的选定值。

    <asp:ListBox ID="ddlUsers" runat="server" Rows="10" SelectionMode="Multiple">
       <asp:ListItem Text="Chennai" Value="044"></asp:ListItem>
       <asp:ListItem Text="Hyderabad" Value="040"></asp:ListItem>
       </asp:ListBox> 
   <asp:Button ID="btnDate" Text="Date" OnClientClick="submitForm()"  runat="server" />  

<script language="javascript" type="text/javascript">
         function submitForm() {
             var lstAdmins = document.getElementById('ddlUsers');
             var SelectedIDs = "";
             var SelectedNames = "";
                 if (lstAdmins != null) {
                     for (i = 0; i < lstAdmins.options.length; i++) {
                         if (lstAdmins.options[i].selected) {
                             if (SelectedIDs == '')
                                 SelectedIDs = lstAdmins.options[i].value;
                             else
                                 SelectedIDs += ";" + lstAdmins.options[i].value;

                             if (SelectedNames == '')
                                 SelectedNames = lstAdmins.options[i].text;
                             else
                                 SelectedNames += ";" + lstAdmins.options[i].text;
                         }
                     }
                 }
             var theAdmin = dialogArguments;
             theAdmin["id"] = SelectedIDs;
             theAdmin["name"] = SelectedNames;
             window.returnValue = "OK";
             self.close();
         }

     </script> 

现在输出将是“044; 040;”和“钦奈;海德拉巴;”通过这种方式,我们可以将值(这里是admin)从父表单传递给子表单,结果也可以在父表单中使用(参数的范围不会丢失)。