passing data from parent window to popup

[meenakshi]

hi forum
i have read a lot of articles regarding passing data from popup to parent up but i m looking for the opposite
that is
from parent to popup window
pls help me in this regard
i have three input fields in parent window
and three in popup window

parent.htm



<script language="JavaScript">
function newWindow(file,window)
{msgWindow=open(file,window,'scrollbars=yes,resizable=no,width=550,height=400');
if (msgWindow.opener == null) msgWindow.opener = self;
}
</script>

<input type="button" value="Search" onClick="newWindow('popup.htm','window2')">

<form name="inputform1" >
<table><tr><td>Stitching Number
</td>
<td><input type="text" name="txtasno" tabindex="1" size="20">
</td>
<td>Remarks
</td>
<td><input type="text" name="txtremarks" tabindex="5" size="20">
</td>
<td>Sales Person
</td>
<td><input type="text" name="txtsperson" tabindex="6" size="20">
</td>
</tr></table>
</form>


popup.htm


<form name="outputform1" >
<table><tr><td>Stitching Number
</td>
<td><input type="text" name="txtasno" tabindex="1" size="20">
</td>
<td>Remarks
</td>
<td><input type="text" name="txtremarks" tabindex="5" size="20">
</td>
<td>Sales Person
</td>
<td><input type="text" name="txtsperson" tabindex="6" size="20">
</td>
</tr></table>
</form>


i hope there is a way to do this
smile always:)
anand

[codeexploiter]

I hope you are looking for a way to copy the value from the input fields in your parent window to the popup window input fields. If so you can use the following code:


window.onload = function(){
var pw = parent.window;
if(pw){
var inputFrm = pw.document.forms['inputform1'];
var outputFrm = document.forms['outputform1'];

outputFrm.elements['txtasno'].value = inputFrm.elements['txtasno'].value;
outputFrm.elements['txtremarks'].value = inputFrm.elements['txtremarks'].value;
outputFrm.elements['txtsperson'].value = inputFrm.elements['txtsperson'].value;
}
}

Put the above code in the <script> element of your POPUP WINDOW page. Please note that you can have only one onload event on the window object if you have multiple onload events then you need to club them together, if you don't have multiple onload events leave this point.

[meenakshi]

hi wow thanks
i will try to use it and get back to u with the successful result hopefully:)
thanks
smile always
anand

[meenakshi]

hi
and how should i use multiple onload event?
i m asking because in popup i already have one onload running
should i use a new function and put both the functions in it and then go for onload for the new function?
is that the way?
smile always
anand

[codeexploiter]

hi
and how should i use multiple onload event?
i m asking because in popup i already have one onload running
should i use a new function and put both the functions in it and then go for onload for the new function?
is that the way?
smile always
anand

You can insert your existing onload code inside the window.onload function that I've provided, which will be get executed correctly. I don't think for that purpose you need to create another new function.

[meenakshi]

I hope you are looking for a way to copy the value from the input fields in your parent window to the popup window input fields. If so you can use the following code:


window.onload = function(){
var pw = parent.window;
if(pw){
var inputFrm = pw.document.forms['inputform1'];
var outputFrm = document.forms['outputform1'];

outputFrm.elements['txtasno'].value = inputFrm.elements['txtasno'].value;
outputFrm.elements['txtremarks'].value = inputFrm.elements['txtremarks'].value;
outputFrm.elements['txtsperson'].value = inputFrm.elements['txtsperson'].value;
}
}

Put the above code in the <script> element of your POPUP WINDOW page. Please note that you can have only one onload event on the window object if you have multiple onload events then you need to club them together, if you don't have multiple onload events leave this point.

hi
well i tried to do so but the popup window does not show anything in the input field:(
it is still blank:(

[codeexploiter]

Hi Meenakshi,

I am so sorry that I've made one mistake in my initial code thats why it fired an error and stucked at its execution. I've corrected my code and it is working now correctly



window.onload = function(){
var pw = window.opener;
if(pw){
var inputFrm = pw.document.forms['inputform1'];
var outputFrm = document.forms['outputform1'];

outputFrm.elements['txtasno'].value = inputFrm.elements['txtasno'].value;
outputFrm.elements['txtremarks'].value = inputFrm.elements['txtremarks'].value;
outputFrm.elements['txtsperson'].value = inputFrm.elements['txtsperson'].value;
}
}



I had used parent.window instead of window.opener I am extremely sorry about this error. Now the thing you wanted is working fine.

[jscheuer1]

You can also pass values from parent window to child windows from the parent page if the child window is opened with javascript and that instance is assigned to a variable on the page in the parent window.

[meenakshi]

hi codex
wow it works and thanks a lot for helping me to find a solution:)
thanks once again
smile always:)
anand

[meenakshi]

hi codex one more question
i m attaching the files and the ms access database
what i m doing is that in the popup file ie daily1.htm i have a search field which i have linked with ms access database and get results.i have also linked with the help of ur code the parent file with daily1.htm which transfer the data to search field.
only issue is that the data gets transferred to pop up search field but does not filter the records(pls enter stitching number as 28 in parent.htm) unless tab is pressed.
i might be sounding confusing but if u can see and tell me is there a way to do the transfer and load the search field
smile always:)
anand
attach file-testing.zip

[codeexploiter]

You have two problems in your code due to which it creates problems:

1. You've tried to access a form element whose name is 'txtSearchPara' through a non-existing ID field in the following line

var para = document.getElementById("txtSearchPara").value;
The above line should be changed to the following one:

var para = document.forms['outputform1'].elements['txtSearchPara'].value;

2. You need to change the order through you've tried to execute the window.onload. The problem here is you are executing getSearchResults function before copying the values from the parent window as a result you'll always get all the values being displayed, which is incorrect nature I assume. Here one more thing I would like to clarify now if no data specified in the search field all the records will be displayed, are you sure you need this functionality or make it sure that if nothing entered in the search field no data will be displayed?

Anyway I've changed the following code a bit so that it works properly.



window.onload = function(){
var pw = window.opener;
if(pw){
var inputFrm = pw.document.forms['inputform1'];
var outputFrm = document.forms['outputform1'];
outputFrm.elements['txtSearchPara'].value = inputFrm.elements['txtasno'].value;
if(outputFrm.elements['txtSearchPara'].value != '')
getSearchResults();
}
}


Insert this refined code in place of your existing code. Now if you enter anything in the search field then it will display that record in the popup if the record(s) existing in the database. If you not enter any value in the search field and press search button now it won't show any records at all as I am using an if condition check before calling getSearchResults method. This method will fail if the user enter space characters. If you don't want this functionality then you can comment the the following line

if(outputFrm.elements['txtSearchPara'].value != '')

So in every case the getSearchResults method will be executed.

If you have any problems with my explanation let me know about it.

Hope this helps.

[meenakshi]

hi codex
thanks a lot
i think i m really lucky to have been a part of this forum
infact i have been member of three forums and i feel really surprised and happy also by the way people help others here:)
thanks forum
people like you are examples for how things should be done
really nice
god bless
anand
smile always:)

[meenakshi]

hi codex
i have a query about the line you have mentioned on above


if(outputFrm.elements['txtSearchPara'].value != ' ')


this works but when i just use tab to move to other box the if condition fails
is there a way out where i can write something like


if(outputFrm.elements['txtSearchPara'].value != 'null')

that is if the field is empty it should not show any record even when tab is pressed
pls suggest
smile always:)
anand

[codeexploiter]

The value of a form field like text box is always a string. So even if you give 'null' or null in it that will be treated as a string, in other words the string 'null' is meaningful as it is a meaningful string.

You have a 'onblur' event associated with the 'txtSearchPara' text box thats why it shows the records when you press tab from the 'txtSearchPara' textbox even it contains no value.

We can avoid this problem by changing the code a bit further like the following:

1. Introduce a trim function that works on string and will eliminate leading and trailing empty spaces - JavaScript doesn't support a trim function. Insert the following function within the script element.


function trim(str){
return str.replace(/^\s\s*/, '').replace(/\s\s*$/, '');
}


2. Change the getSearchResults function in the following manner - Changes highlighted:


function getSearchResults() {
try {
var para = document.forms['outputform1'].elements['txtSearchPara'].value;
para = trim(para);
if (!para) {
return; //txtSearchPara element doesn't contain any value so return. No need to go further.
}
var dbfile = getDBFile();
var cn = new ActiveXObject("ADODB.Connection");

var strConn = "Provider=Microsoft.Jet.OLEDB.4.0;Data Source =" + dbfile + ";Persist Security Info=False";
cn.Open(strConn);
var rs = new ActiveXObject("ADODB.Recordset");

var SQL = "select * from daily where " + "ddday like '%" + para + "%' order by dmon, ddday ";

rs = cn.Execute(SQL);
var resultString = "<table>";
resultString = resultString + "<tr> " + "<td><b>Date</b></td>" + "<td><b>Total Pcs</b></td>" + "</tr>";
var sno = 0;
var tno = 0;
var color;
var bcolor;
var size1 = "5";
var dday;
var tmon = 0;
while (!rs.EOF) {

sno = sno + 1;
tno = tno + rs("dpcs");
color = "#C36241"; // pink colour
bcolor = "white";

if (rs("bday") == 1) //week if else condition
{
dday = "Sunday";
} else if (rs("bday") == 2)

{
dday = "Monday";
} else if (rs("bday") == 3)

{
dday = "Tuesday";
} else if (rs("bday") == 4)

{
dday = "Wednesday";
} else if (rs("bday") == 5)

{
dday = "Thursday";
} else if (rs("bday") == 6)

{
dday = "Friday";
} else if (rs("bday") == 7)

{
dday = "Saturday";
}

if (rs("dmon") == 1) //month values display if else function
{
tmon = "January";
} else if (rs("dmon") == 2)

{
tmon = "February";
} else if (rs("dmon") == 3)

{
tmon = "March";
} else if (rs("dmon") == 4)

{
tmon = "April";
} else if (rs("dmon") == 5)

{
tmon = "May";
} else if (rs("dmon") == 6)

{
tmon = "June";
} else if (rs("dmon") == 7)

{
tmon = "July";
} else if (rs("dmon") == 8)

{
tmon = "August";
} else if (rs("dmon") == 9)

{
tmon = "September";
} else if (rs("dmon") == 10)

{
tmon = "October";
} else if (rs("dmon") == 11)

{
tmon = "November";
} else if (rs("dmon") == 12)

{
tmon = "December";
}

resultString = resultString + "<tr>" + "<td bgcolor=" + color + " ><font size=" + size1 + " color=" + bcolor + ">" + dday + "," + rs("ddday") + "-" + tmon + "</td>" + "<td bgcolor=" + color + " ><font size=" + size1 + " color=" + bcolor + ">" + rs("dpcs") + " " + " Pcs." + "</td>" +

"</tr>";
rs.MoveNext();
}
resultString = resultString + "<tr> " + "<td><b>Total Pcs.</b></td>" + "<td><b>" + tno + "</b></td>" +

"</tr>";
resultString = resultString + "</table>";
rs.Close();
cn.Close();
document.getElementById("SearchResultPanel").innerHTML = resultString;

} catch(e) {
alert("getSearchResults() : " + e);
}
}


3. A small change in window.onload event - Change highlighted


window.onload = function() {
var pw = window.opener;
if (pw) {
var inputFrm = pw.document.forms['inputform1'];
var outputFrm = document.forms['outputform1'];
outputFrm.elements['txtSearchPara'].value = inputFrm.elements['txtasno'].value;
getSearchResults(); //Removed the if condition that were here earlier
}
}


I've used a trim function here just to avoid any output in the popup window if the user tries to enter multiple space character in the 'txtSearchPara' element.

Now what happens is you are checking tthe value of the txtSearchPara element in the getSearchResults function. If it has a value then it will go and execute the function completely. If it doesn't then it will break the execution a that point and quit.

Hope this helps

[meenakshi]

hi codex
thanks once again:)
it did the job perfectly:)
smile always:)
anand