|
JavaScript - Pass The Value Of The Highlighted Row Back From The Popup To The Parent Window
I have a popup window which display a list of values in a tabular form. I have no problem to do the popup or display the table.
The table has two columns; one is the "code" and the other is the "description". When a row is highlighted and the "SELECT" button in the popup window is clicked, I am supposed to pass the "code" of the highlighted row back to an input textfield in the parent window. And I am struggling with it. Would anybody kindly help? Similar TutorialsHello guys. I've been struggling on how to make this work. I have a problem in Javascript when it comes to passing of value in a input type field. page1.html Code: <html>
<head><title></title></head>
<form action="" method="post>
<input type="text" name="weight" value=""><a href="hw_calculator.html" target="name" onclick="window.open('hw_calculator.html','name','height=270,width=370,toolbar=no,directories=no,status=no,menubar=no,scrollbars=no,resizable=yes'); return false;"> calculate </a>
</form>
</html>
hw_calculator.html Code: <html>
<head>
<title>
Height Converter (Metric/Standard)
</title>
</head>
<body>
<FORM>
<INPUT type=hidden value="(Math.round((P.value * 0.45359)*100))/100" name=K_expr>
<INPUT type=hidden value="(Math.round((K.value / 0.45359)*100))/100" name=P_expr>
<INPUT type=hidden value="(Math.round((F.value * 30.48 + I.value * 2.54)*100))/100" name=C_expr>
<INPUT type=hidden value="(Math.floor(C.value / 30.48))" name=F_expr>
<INPUT type=hidden value="(Math.round(((C.value - (Math.floor(C.value / 30.48) * 30.48)) / 2.54)*100))/100" name=I_expr>
<INPUT type=hidden value="(Math.round(P.value * 0.45359))" name=K_exprrnd>
<INPUT type=hidden value="(Math.round(K.value / 0.45359))" name=P_exprrnd>
<INPUT type=hidden value="(Math.round(F.value * 30.48 + I.value * 2.54))" name=C_exprrnd>
<INPUT type=hidden value="(Math.floor(C.value / 30.48))" name=F_exprrnd>
<INPUT type=hidden value="(Math.round((C.value - (Math.floor(C.value / 30.48) * 30.48)) / 2.54))" name=I_exprrnd>
<h2>Height Converter</h2>
<table border="0" bgcolor="#FFFF99" cellspacing="6" cellpadding="6">
<tr>
<td colspan>
<p class="conv" style="margin-top: 10px; margin-bottom: 10px"><b>STANDARD</b></p>
</td>
<td></td>
<td colspan>
<p class="conv" style="margin-top: 10px; margin-bottom: 10px"><b>METRIC</b></p>
</td>
</tr>
<tr>
<td>
<p class="conv" style="margin-top: 10px; margin-bottom: 10px">Feet : <input maxLength=1 size=1 value=0 name=F> Inches : <input maxLength=2 size=1 value=0 name=I>
</td>
<td>
<p class="conv" style="margin-top: 10px; margin-bottom: 10px"> = </p>
</td>
<td>
<p class="conv" style="margin-top: 10px; margin-bottom: 10px"><input maxLength=3 size=1 value=0 name=C disabled> cm.</p>
</td>
</tr>
<tr>
<td class="conv" colspan="2">
<input type="button" name="Taste" value="Calculate"
onclick="if (rounded.checked == true) {
eval('C.value = ' + this.form.C_exprrnd.value);
eval('K.value = ' + this.form.K_exprrnd.value) }
else {
eval('C.value = ' + this.form.C_expr.value);
eval('K.value = ' + this.form.K_expr.value)
}">
<INPUT type=checkbox name="rounded" value="rounded" checked disabled><font size="1" face="Verdana">Rounded Result</font>
</td>
</tr>
</table>
<p class="conv" style="margin-top: 10px; margin-bottom: 10px">
</body>
</html>
I want the value of Code: <input maxLength=3 size=1 value=0 name=C disabled> , this is from hw_calculator.html, to be passed on the Code: <input type="text" name="weight" value=""> on page1.html. How can I do this? Huge thanks. I have an HTML page that is making use of JQUERY and many other JQUERY plugins. Inside this HTML page there are 2 different types of iFrames that display PHP forms. One is a normal iFrame: Code: <iframe height="740" allowTransparency="true" frameborder="0" scrolling="auto" style="width:100%;border:none;overflow-x:hidden" src="https://www.website.com/machform/embed.php?id=9" title="Contact Us"><a href="https://www.website.com/machform/view.php?id=9" title="Contact Us">Contact Us</a></iframe> The other makes use of a JQUERY plugin called Shadowbox: Code: <a href="https://www.website.com/machform/embed.php?id=8" rel="shadowbox;width=1100;height=950;player=iframe" class="button1"><span></span><strong>Click Here</strong></a> Inside these iFrames are PHP forms from a PHP form application called MachForm, which is highly customizable. Here are the questions. Ultimately, I want to accomplish 2 things: 1. I would like to send variable information from the PHP form in the iFrame to my HTML page, to be displayed within javascripts. For example: If someone fills out a PHP form in my iFrame and clicks submit, I want to have a JQUERY popup say, "Thank you, [NAME]". 2. When the user submits the form, the action of clicking the submit button in the PHP form should enable #1, above. There needs to be a way to tell the HTML/Javascript that the submit button on the PHP form in the iFrame has been clicked. I realize this is all fairly vague, especially without the addition of more code. However, I am not even sure if I am posting this in the correct forum, since it incorporates a little of several languages and styles. From this point any direction or idea would be very helpful! Hi I wanted to control parent page form popup. For example, I have a page: http://www.cmela.com/zz.php When i open a popup by clicking "Click Here to open popup page" and then on popup window, i wanted it to transfer parent page from making a click on a pop up window. Example is at: http://www.cmela.com/zz.php open pop up window, and then by clicking on a link on a pop up window i wanted my parent page to go to www.msn.com any help? Thanks Hey there everybody! I'm learning javascript, and I am having trouble figuring out how to do this. Maybe you guys can help me out. What I need is for my main page to have a text field. Above the text field there should be a set of images for bold, italics, underline, etc; when you click on them it inserts the html code <b></b> at the cursor point. Next I want there to be a link, that when clicked will open a popup box with smileys. When you click on one of the smiley images it should insert the smiley code (example :smile: ) into the parent window text field. And would it be possible to make that work with pages of emotes? Or perhaps a second popup window? I hope I explained that without it sounding confusing. I would really appreciate any help. Here is my basic code, it does not include a popup code however. Code: <html>
<script type="text/javascript">
function insert(el,ins) {
window.lstText={};
if (el.setSelectionRange){
el.value = el.value.substring(0,el.selectionStart) + ins + el.value.substring(el.selectionStart,el.selectionEnd) + el.value.substring(el.selectionEnd,el.value.length);
}
else if (document.selection && document.selection.createRange) {
el.focus();
var range = document.selection.createRange();
range.text = ins + range.text;
}
}
</script>
<body>
<form>
<textarea rows="20" cols="100" name="txt1" onfocus="window.lstText=this;">
This is sample text, click anywhere in here then
choose on of the buttons above to see text inserted.
</textarea><br /><br />
<img src="http://i570.photobucket.com/albums/ss141/vwcorrado/Docs_smiley.jpg" onclick="insert(window.lstText,'hello')">
<input type="button" value="hi" onclick="insert(window.lstText,'hi')">
<br />
</form>
</body>
</html>
i have this code i need to close the parent.html window when the child window opened, i need the code for that working well in IE and Firefox Parent.html <HTML> <SCRIPT TYPE="text/javascript"> function sendTo() { window.open('child.html','_blank','resizable=yes,width='+(screen.width-500)+',height='+(screen.height-500)+''); } </SCRIPT> <BODY > <form name="form"> <input type="text" value="" name="text1" id="pdetails1"> <input type="text" value="" name="text1" id="pdetails2"> </br> <input type="submit" value="submit" onClick="sendTo()"> </BODY> </HTML> child.html <html> <body> <form> <input type=text name="text5" value=""> <input type=submit name="submit"value="submit"> </form> </body> </html> After following the instructions from the answer below: http://bytes.com/topic/javascript/an...arent-document I was able to have the child window perform the function defined in the parent window. The function was to only have an alert window pop up as the child page was loading. I easily modified this to my intention which was to have a parent function performed when the child window was clicked. Using the body tag: Code: <body onclick="parent.FUNCTION NAME HERE()"> I first change the method in which the function would be triggered, all went well there. then I tried to change which function would be triggered. (Basically use the function I wanted to happen on click of the child window rather then the function from the test). Once I did this switch, nothing happens. The site this is being used on is: http://tylerpanesar.ca/ What I want is when the menu bar is open in the parent window, the user chooses a link and the menu closes and goes to that link in the child window. This already works. However if the user opens the menu bar and then changes there mind and continues with the page the are currently on (clicks any content in the child window), the menu stays open. Currently the menu "hides" only when you choose one of the menu items, but it does not "hide" when you CLICK on child document. If you could figure out how to get it to "hide" on a "mouse out" that would be the better option. I attempted this method however i could only get it to "toggle" the menu on "mouse out". This method does however create an annoying flicker when you hover over the menu items (as it is toggling the open menu command I guess). If I had it "hide" the menu on "mouse out" it would "hide" as soon as you moved off of the main button. The viewer doesn't even have a chance to click a link. or at least that is what happens when I did it. You may have a better method to achieve this. The script that tells it to hide on click is within a jQuery function: Code: menua
.click(
function(){
menu.hide();
the code I used for the mouseout toggle was: Code: menu
.mouseout(
function(){
menu.toggle();
Here is the script that I am currently using for the menu to open and the "click" hide feature. This menu feature comes from the following help: http://www.bennadel.com/blog/1740-Bu...-FaceBook-.htm Code: <script type="text/javascript">
jQuery(function( $ ){
var menuRoot = $( "#menu-root" );
var menu = $( "#menu" );
var menua = $( "#menu a" );
// Hook up menu root click event.
menuRoot
.attr( "href", "javascript:void( 0 )" )
.click(
function(){
// Toggle the menu display.
menu.toggle();
// Blur the link to remove focus.
menuRoot.blur();
// Cancel event (and its bubbling).
return( false );
}
)
;
menua
.click(
function(){
// Toggle the menu display.
menu.hide();
}
)
;
// Hook up a click handler on the document so that
// we can hide the menu if it is not the target of
// the mouse click.
$( document ).click(
function( event ){
// Check to see if this came from the menu.
if (
menu.is( ":visible" ) &&
!$( event.target ).closest( "#menu" ).size()
){
// The click came outside the menu, so
// close the menu.
menu.hide();
}
}
);
});
</script>
I've tried adding the click to "hide" menu feature to the child document but there is now menu in that document for it to "hide". What I was trying to was have the child document execute a function from the parent document and have that function executed IN the parent document. I've tried the technique from the link in my very first post but I believe it only calls the function from the parent and executes it IN the child. Which does not work for me as the menu is not in the child. There should be a way to make the child execute a function FOR the parent. I apologize for this very wordy post, but I am extremely frustrated with this now as I have been trying to get this to work for a few weeks now. Any help would be greatly appreciated. Thanks in advance, Tyler I have created and opened a child window called "checkwin" and have written some data to it. If the data is valid, I want the user to click on the 'CONFIRM' button on the child window, at which time I want the "submit()" function for the form on the parent window to be executed. If the data is invalid the user clicks on 'MODIFY' and I want focus to return to a field on the parent form. However, when I click on the "CONFIRM" or "MODIFY" buttons on the child window, nothing happens. Here is the code: Code: checkwin.document.write("</td></tr><tr><td align='right'><input type='button' value='CONFIRM'
onclick='opener.document.personnel_form.submit()'></td><td></td><td><input type='button' value='MODIFY'
onclick='opener.document.personnel_form.first_name.focus()'></td></tr></table>")
Hi All, I need to show/focus the parent window which is in back when click a link from child window in Chrome.This problem is in Chrome browser only. We have used the below code self.blur(); Window.opener.focus(); But this is not working in Google Chrome. Please suggest me some workaround to achieve this. Thanks in Advance Reply With Quote 12-19-2014, 09:26 PM #2 Old Pedant View Profile View Forum Posts Supreme Master coder! Join Date Feb 2009 Posts 28,311 Thanks 82 Thanked 4,754 Times in 4,716 Posts Window is not defined. window is. JavaScript (and the DOM) is case sensitive. You must pay attention to upper/lower case spelling, carefully. By the way, you shouldn't need the blur() call. If you focus on some window (any window) then any other focus should be lost. I am currently creating which will allow the user to upload their own pictures. For this I am opening a new pop up window where the user can select the file they wish and then upload it (similar to ebay's picture upload). The pop up works fine and so does the file upload however I am having trouble transferring any data from the pop up window back to the parent window. I have been investigating the opener method but cannot seem to get it to work. Below is some simple code that I've been trying to get to work... Thanks for any help! first page... Code: <form name="loadpic" id="loadpic" action="createPost.php" method="post">
<br />
<br />
Testing transfer between pages... <input type="button" value="open pop up" onclick="window.open('popup.php','pop up box','width=400,height=200')" />
<br />
<br />
<span name="myspan" id="myspan">text here</span>
</form>
pop up page... Code: <head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Pop Up</title>
<script language=javascript>
function transfer(){
opener.document.loadpic.myspan.innerHTML = "working";
window.close();
}
</script>
</head>
<body>
This is the pop-up page!
<input type="button" onclick="return transfer()" value="press me" />
</body>
Hi, I am creating a new child air window called "test.html" as follow. How can I call a javascript function in parent window from child window? function createMyWindow() { var options = new air.NativeWindowInitOptions(); options.type = air.NativeWindowType.LIGHTWEIGHT; options.systemChrome = air.NativeWindowSystemChrome.NONE; options.transparent = true; mywindow = air.HTMLLoader.createRootWindow(false, options, false); mywindow.load(new air.URLRequest("test.html")); .... } Thanks, ASM Hi, I have parent page with 10 child window and i want to close all child window when click on close session button on parent but first i need to check whether any child window open or not after that action should be done for close the child window. For a parent window opened a child window, how can the parnet window be notified when the child window is closed or terminated? Thank you. I have an Iframe in my webpage wher I have the focus. I now want to give the focus back to the parent document, so i've used top.focus() in my code. Works fine in almost every browser but not inIE7. Any hints? I have the code below in my popup window which currently brings up a blank page in the background as the main window. Instead I want the popup to come up but the original page I left is in the background as the main window. Does anyone know how I can do that with the code I currently have. Code: <html>
<head>
<title>JavaScript Popup Example 3</title>
</head>
<script type="text/javascript">
function poponload()
{
testwindow = window.open("", "mywindow", "location=0,status=0,scrollbars=0,width=350,height=400");
testwindow.moveTo(0, 0);
testwindow.document.write('<h1>Get outta here!</h1><a href="javascript:void(0);" onclick="window.opener.history.go(-1); self.close();">Parent back button</a>');
testwindow.focus();
}
</script>
<body onload="javascript: poponload()">
</body>
</html>
The question is on iframes/bookmarkablity and back button functionality. This issue I am facing is how to create iframes with bookmarkable url's without loosing the back button functionality.Lets say all the pages are in the same domain and the child pages inform parent of the child page load for updating the window.location.hash property to modify the current browser address bar. The updation of the url works fine on IE/FF/webkit. But the back button works as expected in IE-8 but the browser back-button does not work in FF/webkit (just the url changes the previous page is not loaded). If we don't update the window.location.hash property the back button works but the window url is not meaningful. Is there a way to get this functionality accross browsers, or is there an easier better way to do it (any other js libs). All pages are served from the same server to get around the permission issue. Gmail and other sites looks like they does something like this. Hi, i need to pass variables to a popup page. I have already made the page i want to be popped up, it is called popup.html and is in the same file location. Here is how i am making the page popup: Code: <head>
<script type="text/javascript">
function prizes(){
var prize1 = .....
var prize2 = ..... .ect .ect
myRef=window.open('popup.html','mywin','left=20,top=20,width=500,height=500,toolbar=0,resizeable=1');
myRef.focus()
}
</script>
</head>
so now i need the variables prize1, prize2....ect. to be used in the popup.html page. i now its nearly xmas but i need this for tomorrow so please help ASAP, PLEASE!! Thanks in advance! Thorbob I'm using submodal-1.6 for popup. When the popup closes I wanted parent page to refresh.I've tried the following window.opener.location.load(); window.opener.location.load(true); location.load(); window.parent.location.reload(); All works for IE, but when coming to mozilla ,firefox the refresh is a step delayed, i.e when I open my popup to add an itme to my cart on parent page ,for the first time it does not show anything , but when I try to add another item , the first one shows. Any advice would be really great. Hey guys, Been searching on google for two days now, without a valid answer. I'm NEW to javascript, so I need some good help on this haha. I am using the following little piece of code to open a popup window: Code: <SCRIPT LANGUAGE='JAVASCRIPT' TYPE='TEXT/JAVASCRIPT'>
<!--
var win=null;
function NewWindow(mypage,myname,w,h,pos,infocus){
if(pos=="random"){myleft=(screen.width)?Math.floor(Math.random()*(screen.width-w)):100;mytop=(screen.height)?Math.floor(Math.random()*((screen.height-h)-75)):100;}
if(pos=="center"){myleft=(screen.width)?(screen.width-w)/2:100;mytop=(screen.height)?(screen.height-h)/2:100;}
else if((pos!='center' && pos!="random") || pos==null){myleft=0;mytop=20}
settings="width=" + w + ",height=" + h + ",top=" + mytop + ",left=" + myleft + ",scrollbars=no,location=no,directories=no,status=no,menubar=no,toolbar=no,resizable=no";win=window.open(mypage,myname,settings);
win.focus();}
// -->
</script>
The actual link to open the popup is like this: Code: <a href="javascript:NewWindow('upload.php','popup','550','252','center','front');">Open the popup</a>
What I am opening is, an upload page to upload an image (PHP / AJAX). Once the upload is complete and I close the window, I need the parent window (the index page which the link to open the popup is on) to be refreshed, so you can see that the file has been successfully uploaded. Does anyone have a clue how I would fix this? If I need to use another code to open the popup, that's fine, I just need help on how to fix this, since I haven't been able to find the answer myself. Thanks in advance! Hello, First post here. I have the need to create a popup after a delay. The problem I'm getting is that the parent page is refreshing automatically from the action of creating the popup. I don't want the parent page to refresh! This is what I currently have: Code: $popupScript = '
<script language="JavaScript">
setTimeout("window.open(\'index.php?do=renew\',\'Popup1\',\'toolbar=0, width=500, height=500\')",' . $delay . ');
</script>';
The page is in php, so that's why I have it as a string, which I later pass to a template page. This would simply be: Code: <script language="JavaScript">
setTimeout("window.open('index.php?do=renew','Popup1','toolbar=0, width=500, height=500')",6000);
</script>
... if it was placed straight into the HTML. Incidentally, it's included into the HTML HEAD area, not the body, as the original source of the script suggested: http://www.itechies.net/tutorials/js...op-delayed.htm $delay is the delay before the popup opens, in microseconds (so 6000 would be 6 seconds). What can I do to have the same delayed auto-popup functionality, but without it automatically refreshing the parent page where the above code resides? As some background to what I'm achieving: The issue with not wanting the parent page to refresh is that each time it does, the login session gets extended. The popup itself (which I already have working ok) provides a 'continue working' function, or close and refresh the parent is nothing has been done after a short period. Any help very welcome. Hello: I have the following div popup window: PHP Code: <div id='PopUp' style='display: none; position: absolute; height: auto; left: 13px; top: 10px; border: solid black 1px; padding: 10px; background-color: rgb(255,255,225); opacity:.95; text-align: justify; font-size: 12px; width: 70%; z-index:1200;'> <iframe id="mate\" frameborder=0 scrolling=yes width=100% src='client_edit/edit_client_data.php?customerid=$customerid' height=\"790\" align=\"left\"></iframe><br /> <div valign=\"top\" style='text-align: right; display: inline; position: absolute; left: 10px; top: 10px;'><a onmouseover='this.style.cursor=\"pointer\" ' style='font-size: 12px;' onfocus='this.blur();' onclick=\"document.getElementById('PopUp').style.display = 'none' \" ><span valign='left' style=\"text-decoration: underline;\" ><img border='0' src='images/the-delete.png' width='22' height='20' title='Close Window'></span></a> </div></div> the popup is opened from its parent page with the following onclick event: PHP Code: <a href="javascript:void(0)\" onmouseover=\"document.edit_info.src='images/edit-user-info2.png'\" onmouseout=\"document.edit_info.src='images/edit-user-info.png'\" onclick=\"document.getElementById('PopUp').style.display = 'block' \"><IMG SRC=\"images/edit-user-info.png\" NAME=\"edit_info\" width='40' height='40' title='Edit Customer Contacts' ALT=\"...\"></a> Now when the popup is closed, I would like the parent page to automatically refresh. I would appreciate some help on this. To close the popup, the following is invoked: PHP Code: <div valign="top\" style='text-align: right; display: inline; position: absolute; left: 10px; top: 10px;'><a onmouseover='this.style.cursor=\"pointer\" ' style='font-size: 12px;' onfocus='this.blur();' onclick=\"document.getElementById('PopUp').style.display = 'none' \" ><span valign='left' style=\"text-decoration: underline;\" ><img border='0' src='images/the-delete.png' width='22' height='20' title='Close Window'></span></a> </div> |
|||||||