Question

我有父页面和子弹出窗口页面（empW.cfm）。子页面具有搜索字段，用于搜索和显示结果。我必须从thre子页面中选择一个搜索结果并在父页面上填充它。

我无法将正确的选定值从Child传递给Parent页面。

父页面： -

    <script type="text/javascript"  >

    function doSubmit() {
      var Emp = document.getElementById("emp");
      var getName = document.getElementById("getName");
      Emp.value = getName.value;
                }
           </script> 
</head>
<body>
<cfajaximport tags="cfform,cfwindow" scriptsrc="test.js">
<cfform action="Action.cfm" name="formE" id="formE" preserveData="true"  enctype="multipart/form-data" method="post" onsubmit="return validate(document.formE);"  >  
 <table >
    <tbody>    
            <tr><td  > Name*: </td><td><cfinput name="Name" id="Name"  type="text"  ></td></tr>          

             <tr><td > EMP:</td>
<td><input name="searchName" id="emp" onclick="ColdFusion.Window.create('w1','Title','empW.cfm')"></td>

    </tr>  
   </tbody>
 </table>
</cfform>

儿童/窗口页面： -

   <cfform name="formI" id="formI" preserveData="false" method="post">
 <table>
 <tr>SERACH:-  <input name="getName" id="getName" type="text" value="Find emp name" >
<cfif isdefined('form.getName')>
<tr>
<cfloop startrow="1" endrow="qry" query="qry">
   <cfoutput>Selected = #qry.getName# 
 <input name="Add" id="getNm" type="button" value="submit" onclick="document.getElementById('emp').value=document.getElementById('getName').value;">
</cfoutput>
</ cfloop>
tr>

</cfif>
 </table>
</cfform>

示例： - 子页面上有10个搜索结果，我选择了第8个结果，但仍然只有第1个结果填充了父页面。每次选择搜索结果时都会选择这种情况。当我单击Child上的Submit按钮时，只传递搜索结果的First值。

如何将精确选择的搜索结果从Child传递到Parent页面。

Answer 1

两件事。您应该从javascript标记中删除src。并将其移动到第二组脚本标记。您的“getName”字段需要唯一值。现在，您将获得具有相同ID的多个getName字段。另外，在旁注中，如果您正在使用它，则无需导入cfform。

Answer 2

我想出了你的问题，让我解释你的问题：

只需了解我的简单代码：

<html>
    <head>
        <script>
            function transform(){
                var x_elements = document.getElementsByName('x');
                var y_elements = document.getElementsByName('y');
                var i=0;
                for (i=0; i<x_elements.length; i++)
                {
                    y_elements[i].value = x_elements[i].value;
                }
            }
        </script>
    </head>
<body>
    <select name="x" id="x">
        <option value="1">one</option>
        <option value="2">two</option>
        <option value="3">three</option>
    </select>
    <select name="x" id="x">
        <option value="5">five</option>
        <option value="6">six</option>
        <option value="7">seven</option>
    </select>
    <br/>
    <select name="y" id="y">
        <option value="1">one</option>
        <option value="2">two</option>
        <option value="3">three</option>
    </select>
    <select name="y" id="y">
        <option value="5">five</option>
        <option value="6">six</option>
        <option value="7">seven</option>
    </select>
    <br/>
    <input type="button" value="Check" onclick="javascript:alert(document.getElementById('x').value);" />
    <br/>
    <input type="button" value="Transform" onclick="javascript:transform();" />
</body>
</html>

我故意将两个select标记保持相同的名称和ID。通过id访问元素时，您只能访问具有相同ID的第一个元素（例如，“检查”按钮）。所以你可以使用documents.getElementsByName()。

最后我仍然建议尽量避免这种情况并保持id对每个元素都是唯一的。您可以使用循环和计数器生成唯一ID。例如name1，name2等..

要快速轻松地使用javascripting，请使用jQuery。

将错误的值从子页面传递到父页面。

2 个答案: