JavaScript - Getting The Parent For A Document
Dear Great Coders,
I am having some trouble to get the id of the parent of a document which is iframe1 here. As you can see it the <javascript> is residing in the javascript section. Do mind giving me some ideas? Yes, I know. I can insert the javascript on the top, but believe me i cant for some purpose because I am intergrating many other codes into it. <html> <iframe id="iframe1"> <html> <head> <javascript> </head> <body> </body> </html> </iframe> </html> Similar TutorialsHello all, I have a page which has a form and also one iframe in the same. there is a button on the parent form. when the button is clicked, i am submitting the iframe and parent both. forms are getting submitted. but when i do print_r for iframe values, it is blank below is the code Parent page: Code: <? print "<pre>"; print_r($_POST); print "</pre>"; ?> <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN"> <HTML> <HEAD> <TITLE> New Document </TITLE> <META NAME="Generator" CONTENT="EditPlus"> <META NAME="Author" CONTENT=""> <META NAME="Keywords" CONTENT=""> <META NAME="Description" CONTENT=""> </HEAD> <SCRIPT LANGUAGE="JavaScript"> <!-- function validate(){ document.getElementById('mainform').submit(); window.frames['iframe1'].document.forms[0].submit(); } //--> </SCRIPT> <BODY> <FORM METHOD=POST ACTION="" name='mainform' id='mainform'> <TABLE> <TR> <TD>Name</TD> <TD><INPUT TYPE="text" NAME="Name_VC"></TD> </TR> <TR> <TD>Address</TD> <TD><INPUT TYPE="text" NAME="Address_VC"></TD> </TR> <TR> <TD colspan=2><INPUT TYPE="button" name="proceed" value="Save" onClick="validate();"></TD> </TR> </TABLE> </FORM> <iframe src="test1.php" id='iframe1'></iframe> </BODY> </HTML> iframe page : test1.php Code: <? print "<pre>"; print_r($POST); print "</pre>"; ?> <form name='mainform2' id='mainform2' method='post' action=''> Roll number : <INPUT TYPE="text" NAME="Rollnum" value=''> Age: <INPUT TYPE="text" NAME="Age_IN" value=''> </form> Please tell me what is my mistake or how can i achieve values of all 4 fields Million thanks My code is here and it works ... However, I would like my dynamic table to show on the same page as my body and not on a new blank page. I have created a DIV and try playing around with the document.getElementById('monTab').innerHTML but it's not working out for me ... What am i missing ? Regards, Code: <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN"> <HTML><HEAD><TITLE>new Script - Javascript Cours 11</TITLE> <META content="text/html"; charset="UTF-8" http-equiv="content-type"> <SCRIPT type="text/javascript"> function createTable(){ var Etudiant = new Array(Number(prompt("How many Students will you put in ?",""))); document.write("<table border=\"1\">"); for (var i=0; i<Etudiant.length; i++) { Etudiant[i] = window.prompt("S'il vous plait entrez le nom d'un etudiant " + (i+1) + ".","") alert("Nice to see you "+Etudiant[i]); document.write("<td>"+Etudiant[i]+"</td>"); j = parseInt(prompt("Combien de notes voulez vous calculez ?")); for (h=0;h<j;h++){ notes[h] = parseInt(prompt("S'il vous plait entrez la "+(h+1)+" note de "+Etudiant[i])); document.write("<td>"+notes[h]+"</td>"); } document.write("<tr>"); } document.write("</tr>"); document.write("</table>"); document.getElementById('monTab').innerHTML=Etudiant; } </script> <BODY> <H1>Combien de note voulez vous cumulez ?</H1> <br> <br> <input type="button" name="btnSubmit" value="TRY IT" onclick="createTable()"> <div id="monTab" size="10"> Content should come here ...Content should come here ...Content should come here ...Content should come here ...Content should come here ...Content should come here ...Content should come here ... </div> </BODY> </HTML> Hello everyone, I have a page. In that page is an iframe, lets name it 'A'. inside A there is another iframe 'B'. there is a link on that page which on click opens a popup. In that pop up, there is actually a document upload facility. Now i want that after every upload (onSubmit), iframe A should refresh. have done it many times but today its not working. Code: function validate() { (window.parent.opener.location.href)=(window.parent.opener.location.href); window.parent.opener.location.reload(true);// this is tried as well } Can some one please help. it always refreshes only B. Thanks I found this line in one of the scripts on javascript.kit <code> if(document.layers|| document.getElementById|| document.all) </code> Could someone give me an idea on why this line would be used in a code? Thank you very much I'm working on a website that will basically embed a widget/frame sent by a handler into a user's current page. The user basically adds a script tag to where they would like the HTML to be. The script tag has their settings and is basically a document.write that calls all the code that we want displayed. So here's my problem. We have a map that we need to add in a specific section, and to get the map we have to call another script tag. So we end up having a script tag (map) embedded in another script tag (the code for the widget/frame) or we end up having to document.write inside a document.write. Now this works just fine and as expected in Firefox, Safari, and Chrome. However, Internet Explorer and Opera wait until the first document.write is completely finished before calling the embedded one. Of course the problem with this, is that it takes the map out of the document's flow and just appends it to the bottom left of the page. Since the rest of the page has already been called, there's no way to move the interior "map" script. Any ideas? Basically just trying to figure out how (if even possible) to render an embedded script tag in Internet Explorer and be able to place it properly. I've tried everything that I can think of, including AJAX and Google's unescape script. Any suggestions, I'd greatly appreciate it. Or even if you've encountered a similar problem, and know that it just isn't possible in IE or Opera, that would be fine too. Thanks in advance! Code: /** * @class TestInheritance * * This is a class and it's constructor all in one but the constructor is not set yet */ function TestInheritance(){ this.testName; return this; } /** * @extends Util * Make sure this is called after the constructor/class declaration */ TestInheritance.prototype = new Util(); /** * @ctor TestInheritance * Set it to itself if there isn't an explicit constructor */ TestInheritance.prototype.constructor = TestInheritance; /** * @extends Util * This specifically is set to allow TestInheritance to access it's parent's identity */ TestInheritance.prototype.parent = new Util(); /** * @extends Util * @argument testName String * All functions are called after setting the prototype */ TestInheritance.prototype.setTestName = function(testName){ this.testName = testName; } How would I reference the same Util class on both the prototype and the parent? Hi, I'm very new to javascript and don't really ask questions in forums because i usually find what I'm looking for in other threads. I have a situation where I open a popup window from what I'll call "the main page", insert some text and open a 2nd popup from there. After making a selection, that window closes to bring the 1st popup back to focus. When I submit the form in that window, some info is changed in a database. How can I refresh or reload the main page to show the changes? Is the "main page" still the opener after opening and closing windows?
Hi guys, new to javascript and need some basic help or advice. I have this code which changes the the background postion of the parent(ul) Code: <ul> <li class="highways" onmouseover="if(this.parentNode) this.parentNode.style.background='transparent url(http://www.webaddress.co.uk/website/media/images/Sub_nav_img.jpg) no-repeat 0 -149px';" onmouseout="if(this.parentNode) this.parentNode.style.background='transparent url(http://www.webaddress.co.uk/website/media/images/Sub_nav_img.jpg) no-repeat 0 0';"><a href=" " title="Highways">Highways</a></li> </li> </ul> I would like to do the same thing change the backgroundpossition/images of the div (id="flash") on the hover of the a within the the (div="mySlides2" > div ) Code: <div id="flash"> <img src="images/img1.jpg" width="886" height="229" /> <div id="myController2"> <span class="jFlowControl2">No 1 </span> <span class="jFlowControl2">No 2 </span> </div> <div id="mySlides2"> <div> <a (would like to do somthing on the hover of this) class="vm" href="#" title="Vulnerability Management"></a> <a class="grc" href="#" title="grc"></a> <a class="pci" href="#" title="pci"></a> <a class="gcs" href="#" title="gcs"></a> <a class<div id="flash"> <img src="im="pt" href="#" title="Penetration Testing"> </a> <span class="jFlowNext2 NextFlash"> </span> </div> <div> <span class="jFlowPrev2 BackFlash"> </span> </div> </div> </div> any help of advice would b appricated I have three images nested in three divs that I want to change size on mouseover, but since they're each in their own div, I can't effect their z-indexes relative to one another without targeting their parent divs. I thought I'd be able to contain the images in an <a> tag with z-index style in a mouseover, but I can get it to work. What am I doing wrong here? CSS: Code: .thumb img{ height: 75px; } .thumb img:hover{ height: 150px; } JS: Code: function thmbOver(){ this.style.zIndex = "1000"; } HTML: Code: <div id="div1"><a onmouseover='thmbOver();'><span class='thumb'><img src='thmbs/image1.jpg'></span></a></div> <div id="div2"><a onmouseover='thmbOver();'><span class='thumb'><img src='thmbs/image2.jpg'></span></a></div> <div id="div3"><a onmouseover='thmbOver();'><span class='thumb'><img src='thmbs/image3.jpg'></span></a></div> I've tried a few approaches to the function's targeting, like document.getElementById(this.parent.id).style.zIndex, etc, but still nothing. Any ideas? Thanks, ~gyz Dear Madam/Sir, I would greatly appreciate any help. I am working on this site: http://www.pathology.ubc.ca/Path_UBC...Professor.html. The list of names on the right hand side is conencted to the iframe, left hand side. By clicking on individual name the eprofile is populated in the iframe. Everything works fine but what I would like to add is some kind of extention to the url so we can externaly link directly to each these profiles. Please let me know if this is something that can be done? Many thanks, Debbie I'm trying to accessing the Parent window fom a sub window previously opened using window.open I'm using firebug to t yand debug, and it shows that this DOM entry exists.. window.opener.location.href But trying to access it gives "window opener is null" error I've tried all these, and get the various errors tagged on the end... Code: <script language="JavaScript"> //alert(opener.location); // = opener is null //alert(opener.location.href); // = opener is null //alert(parent.location); // = uncaught exeption - could not convert to javascript argument arg 0 //alert(parent.location.href); // = Permission denied to get property Location.href //alert(parent.opener.location); // = uncaught exeption - could not convert to javascript argument arg 0 //alert(parent.opener.location.href); // = Permission denied to get property Location.href //alert(parent.window.opener.location.href); // = Permission denied to get property Location.href //alert(parent.window.opener.location.href); // = Permission denied to get property Location.href //alert(window.opener.location); // = window opener is null //alert(window.opener.location.href); // = window opener is null //alert(window.parent.location); // = uncaught exeption - could not convert to javascript argument arg 0 </script> driving me crazy! Anyone have a solution? I have a javascript for a tree view but i need to change it according to the requirement. Lets start with example with the treeview as follow: 1 Door phone 1.1 Ready Kits 1.1.1 Audioset 1.1.2 Videoset 1.2 Audio Kits 1.2.1 Elphone 1.2.2 Video Door phone 2 CCTV 2.1 Camera 2.1.1 Dome Camera 2.1.2 IP Camera 2.2 Others Now the thing is in the current treeview a single category is open at a time. like if 1.1.1 is open 1.1.2 will b closed and similarly if 1.1 is open...1.2 will b closed. But i want that when i click on 1(Door phone) ie Door phone...evry node should be opened instead of just one similary when i click on 2(CCTV), all its node should be opened. I hope it will be possible to achieve this and i would be helped. I can also provide with the javascript if required. I'm working on a upload script that uses javascript, and a hidden iframe to upload the files. It all works up until the iframe finishes and needs to send the javascript function call back to the parent page, nothing happens, when it should hide the upload progress bar. I've searched and searched for the awnser, along with trying different alternative to window.top.window, such as window.top, parent, and parent.document and so far nothing has worked, I've even tried the onLoad on the iframe with no success. Parent Page function: Code: function stopUpload(success, ups, file) { var result = ''; var uploaded = '0'; if (success == 1) { result = '<span class="msg">The file was uploaded successfully!<\/span><br>'; uploaded = uploaded ++; if (uploaded == document.getElementById('numflowers').value) { document.getElementById(finish).style.display = 'block'; } } else if (success == 2) { result = '<span class="msg">There was an error during file upload! The file has a size of 0<\/span><br> File: <input name="ufile[]" id="ufile[]" type="file" size="30"> <input type="submit" name="submitBtn" value="Upload">'; } else if (success == 3) { result = '<span class="msg"> We only allow .png, .jpg, .gif, .zip, .rar, and .7z files to be uploaded. If you think we should allow other please make a suggestion on the forums.<\/span><br> File: <input name="ufile[]" id="ufile[]" type="file" size="30"> <input type="submit" name="submitBtn" value="Upload">'; } var uploadp = "upload_process" + ups; var uploadf = "upload_form" + ups; document.getElementById('uploadp').style.display = 'none'; document.getElementById('uploadf').innerHTML = 'result'; document.getElementById('uploadf').style.display = 'block'; } Function call inside iframe (example) Code: window.top.window.stopUpload(3, 1, test.txt) Thanks for the help. Sorry my bad, but im stuck again. I have tried to search in hours, but i cant find the answer. I think you the pro coders will see the code directly. I have an webbpage, and in the middle of it there is an iframe to a php site. So i have used this code, so after some seconds the iframe will send the guest to another page. <meta http-equiv="refresh" traget="_top" content="5 url=http://mypage.com"/> But the thing is that i want the WHOLE page to reload, and go to that page after 5 seconds (we can say). With that code, only the iframe are going to another page. Is it possible to make the whole page send the user after some seconds, to another page and not only the iframe? In order to better understand the DOM data structure, I am trying to write a JavaScript that will produce something like HTML from the DOM data structure. My current problem is that when I include a <br> tag in my source HTML, it reports that its parent is undefined, and this is breaking my code. So, given the following code, why does the <br> tag report that it's parent is undefined. Code: <html> <head> <title>br.parent</title> <script type="text/javascript"> function brTest() { var jBR = document.getElementsByTagName("br")[0]; alert("<br>.nodeType = " + jBR.nodeType + "\n<br>.nodeName = " + jBR.nodeName + "\n<br>.ParentNode = " + jBR.ParentNode); } </script> </head> <body onload = "brTest();"> <p>Now is <br> the time.</p> </body> </html> Thanks for any help you can provide. Jerry currently i have the script as below which open the link in new tab but also shifts the focus to it...how do i keep the focus on the parent window PHP Code: <script type="text/javascript"> function openlink(url) { window.open(url); return false; } </script> <div class="btn" onclick="openlink()">Open Link</div> I am trying to detect the parent URL on a page for a Facebook application so that if the user is on my site rather than accessing the application via Facebook they will be redirected to the FB App page. In PHP I can use: if(strstr($parenturl,"mysite.com")){header("location:fbapp.com");exit;} Is it possible to do this in JS also? Because with FB Apps the URL is not always the same so instead of detecting a full URL I just want to search for my domain name within document.location.href to see if it exists and IF yes > Redirect back to FB. I'm working on a greasemonkey script that requires me to append a tag before each instance of a tag with a specific class name. It works when there's no parent tags but when it goes into levels deep it doesn't work. So how can I use insertbefore?
Hi! I have one frame, for example: test.php: PHP Code: <html> <frameset border="0"> <frame src="http://codingforums.com/test2.php" /> </frameset> </html> test2.php: Code: <script> document.write(self.parent.location) </script> in the test.php is frame and in this frame is test2.php I want to print self.parent.location in test2.php but it does not work! Because test.php is subdomain and test2.php is rootdomain... Is any other way to know parent location? Many thanks... I'm sorry for my bad English. 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. |