|
JavaScript - How To Access Elements Of An Iframe In Javascript
Hi All,
I have html pages with code like <div> <script type="text/javascript" src="http://myserver2/mysite/addhtm.js"></script> </div> the script adds some html code and random images selected from second server inside an iframe tag in the div tag. I need to examine this added html and image properties in my page using javascript. A search on internet did not help, it says elements inside iframe coming from different domain can not be accessed. Is there any workaround or hack available to access iframe contents from page javascript? Thanks Similar TutorialsNormally I would just use document.getElementById to get anything I need but here is my problem: I have a zip code control that I load using AJAX. it has city, state, country, county and zip code. This gets loaded within a business application and at one point you can have both a bill to and ship to address forms on the screen at the same time, loading my zip control with the same fields, same ids and same name. This forced me to now pass in the form name that contains the control. I need to get to divs and spans within this form. Primarily as you type in a city or zip code, I am doing a hot search with a popup div that shows you results you can quickly choose from. The only time this becomes an issue is the situation I mentioned before when the zip code control is on the screen twice. I am not certain how to access the innerHTML of a span or div by way of the form name. Is this possible and if so what is the proper syntax? Here is a very basic example at its simplest form of my problem. Code: <form name="frm_billto" id="frm_billto"> <span id="myspan">Hello</span> </form> <form name="frm_shipto" id="frm_shipto"> <span id="myspan">World</span> </form> In the above example because the control was loaded twice, I now have 2 spans with the same ID. I want the innerHTML of the each span based on the form they are in. We wanted one control that we could use throughout the system that we could update in one place and the entire application be updated. Unfortunately we did not anticipate having it load more than once on the page. Thank you for any help Hi All, I have a javascript application i have built http://dtp3.demodesign.co.uk/uploader/ Now this working in everything excluding IE but i don't under stand why it dose not work in IE it is a JSON Class that loads appends the content. and has an Iframe System to provide a powerful solution to work with AJAX to show file lists Any way if you go to that site it errors in Ie but work in every thing else any one got any idear why that is I need to copy input (checkbox) values from a form inside my iframe to the form in my parent frame using javascript and I'm not sure how to modify my current code to accomplish this! I'm using cold fusion to display the values from a database inside the iframe. Once all the values are loaded into the iframe, I need to be able to select as many as necessary and then submit the form from the parent frame which then runs a report that utilizes those values, but I can't do that because my code is written so that the values load in the iframe form and the action to run the report that requires those values is executed from the form in my parent frame. Here are the code snipits: Quote: Main "Parent" Frame Code Code:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<cfparam name="WordFlag" default="0">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title></title>
<script language="javascript" type="text/javascript">
checked=false;
function checkedAll (frm2) {
var aa= window.document.ActivityFrame.document.getElementById('frm2');
if (checked == false)
{
checked = true
}
else
{
checked = true
}
for (var i =0; i < aa.elements.length; i++)
{
aa.elements[i].checked = checked;
}
}
checked=true;
function uncheckedAll (frm2) {
var aa= window.document.ActivityFrame.document.getElementById('frm2');
if (checked == true)
{
checked = false
}
else
{
checked = false
}
for (var i =0; i < aa.elements.length; i++)
{
aa.elements[i].checked = checked;
}
}
function checkVal (frm2) {
var chks = window.document.ActivityFrame.document.getElementsByName('ActivityList');
var hasChecked = false;
for (var i = 0; i < chks.length; i++) {
if (chks[i].checked) {
hasChecked = true;
break;
}
}
if (hasChecked == false) {
alert("Please select at least one activity!");
return false;
}
return true;
}
</script>
</head>
<body>
<table>
<tr>
<td><CFOUTPUT><H1>#lblReportName#</H1></CFOUTPUT></td>
</tr>
<tr>
<td><CFOUTPUT><H1>#cookie.strProjectName#</H1></CFOUTPUT></td>
</tr>
</table>
<form id="frm1" name="frmPMSelection" method="post" action="../report_manager/index.cfm?fuseaction=ProjectMediaAudit&lblReportName=#URLEncodedFormat(lblReportName)#&WordFlag=#WordFlag#" target="_self">
<table>
<tr>
<td align="left"><CFOUTPUT>#lblSelectPMAActivities#</CFOUTPUT><br /><br /></td>
</tr>
<tr>
<td>
<table>
<tr>
<td align="right">
<cfoutput>
<a href="javascript:checkedAll()"><img src="../graphics_interface/buttons/select_all_#cookie.numLanguagePref#.gif" alt="#Request.lblSelectAll#" title="#Request.lblSelectAll#" align="absmiddle" border="0" /></a>
<a href="javascript:uncheckedAll()"><img src="../graphics_interface/buttons/select_none_#cookie.numLanguagePref#.gif" alt="#Request.lblSelectNone#" title="#Request.lblSelectNone#" align="absmiddle" border="0" /></a>
</cfoutput>
<CFSCRIPT>Request.cshelp.showHelp(str_contentType="screen",str_contentID="",str_helpText=Request.str_lang_cshelp);</CFSCRIPT>
</td>
</tr>
<tr>
<td class="TABLEDATA">
<cfoutput>
<iframe name="ActivityFrame" scrolling="auto" width="480" height="360" src="./index.cfm?fuseaction=ProjectMediaAuditFrame"></iframe>
</cfoutput>
</td>
</tr>
<tr>
<td>
<cfoutput>
<input type="image" src="../graphics_interface/buttons/submit_#cookie.numLanguagePref#.gif" alt="#Request.lblSubmit#" title="#Request.lblSubmit#" align="absmiddle" border="0" onclick="return checkVal()" />
<a href="javascript:void(0);"><img src="../graphics_interface/buttons/cancel_#cookie.numLanguagePref#.gif" alt="#Request.lblCancel#" title="#Request.lblCancel#" align="absmiddle" border="0" onclick="self.location='../report_manager/index.cfm'" /></a>
</cfoutput>
</td>
</tr>
</table>
</td>
</tr>
</table>
</form>
</body>
</html>
Quote: iFrame Code Code:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title></title>
</head>
<body>
<table>
<tr>
<td>
<form id="frm2">
<CFOUTPUT QUERY="qryLODetails">
<input type="checkbox" value="#lo_code#" name="ActivityList" />#lo_name#<br />
</CFOUTPUT>
</form>
</td>
</tr>
</table>
</body>
</html>
I'm thinking that loading the values into some sort of hidden comma delimited string structure in the parent frame would do the trick, any ideas, and if I'm on the right track, how would I go about doing that? Also, you shouldn't need to see the query or the report page code to help me with the javascript I require, but if you do need anything else please let me know!! hi, so I have this page: here which, if you change the select boxes and the start and end values are different, it calls a function in the iframe page (which is here by the way) which was all working great until I looked at it today and it's stopped working... according to me, I haven't changed anything, but now I get the error saying "Permission denied to access property 'calcRoute' " (calcRoute being the function that gets called in the iframe page) I don't really know anything about iframes, but this was working before... any ideas why it stopped? Hi, Does anybody know of an example of creating a draggable iFrame in a similar way what can be done on iGoogle with the iFrame gadget using javascript? The problem that I'm having is that the elements within the iFrame can still steal the input focus when dragging the frame using the bar I'm using to initate the drag process. For example when clicking and holding the mouse down on a bar that I'm using to initiate the drag positioned above the iFrame and then moving the mouse to drag the whole frame containing the bar and iFrame I have a problem whereby if the cursor strays over the google search box on http://www.google.com the editbox steals the input focus and the dragging stops until you carefully move the mouse carefully out of the editbox control. Can anybody point me to a page/the html/css containing an iFrame containing http://www.google.com that can't be interacted with because it has a div on top of it e.g. a semitransparent one would look nice for example. Then hopefully I can incoperate the changes into my javascript on initiation of the drag of the frame to disable the elements within the iFrame? If there are any other solutions to this problem, prefereably with an example that works with browsers back as far as ie6 please let me know? Cheers Ben W Hi, I have the following code snippet: test.html ====== <script language="javascript" type="text/javascript"> var testVariable = "test"; </script> <script language="javascript" type="text/javascript" src="test.js"> </script> test.js ===== var testVariable = window.top.testVariable; In firefox, I'm able to access testvariable defined within test.html in test.js. But in chrome, test.js couldnot get the window.top.testVariable field defined in test.html. Can any one please let me know how i can make it work in chrome?. Am i missing something here?. hi, i want to make an ftp access page using javascript i know it's possible using "ftp://" , but when i use this, the browser loads a window with the ftp folder i want a javascript to get ftp access and to give the commands itself any1 who knows how to get ftp access and ability to give file send/receive/... commands with javascript? Hi, I want to access SQL database using javascript. I am passing 1 value to the java script but I want to pass that value further to the SQL query as an where clause parameter to retrieve data. If the value retrieves multiple or single data then how do i handle it. Is it possible to use dataset in javascript? Regards, Anthony. Hi all, Have problem from getting data of JavaScript Object ie. Associative Array. Code: var a, table1
a = new ActiveXObject("MyProgID"); a.GetDataFromExcel("C:\\Users\\myFolder\\Desktop\\test.xls","Sheet1")
a.Generate()
table1 = a.writeInTable();
Here writeInTable function returns a 2D Object array from DLL written in VB.Net. So I got the Object to table1. But from table1, I can't access the values but its there. table1 shows values as in this image(Image Attached.) Actually, I tried many ways like tab(0)(0) tab[0][0] tab["0"] tab.(0).(0) tab.[0].[0] Also with toArray(), (new VBArray(tab)).toArray().... I don't know what I am wrong..Can anyone help me on this? Thanks... Shanmugavel.C Hi someone please let me know the way to access a smarty value with javascript? my smarty value is = {$value.url} i want to access it like Code: <script type="text/javascript">
function load()
{
document.location = '{$value.url}';
}
</script>
i tried with wrapping code with {literal} {/literal} but it isnt working. can some one correct this please sorry for bad english Thanks Hello everybody, I am new in this forum (and I'm also new in web coding, but not in programming)... This is the first problem I met: I can't understand how to acccess a property in this snippet: Code: function FGGE()
{
this.totalExternals = 0;
this.loadedExternals = 0;
this.loadImage = function(image)
{
image.onload = function()
{
alert("Loaded 1: "+this.loadedExternals+"/"+this.totalExternals);
};
alert("Loaded 2: "+this.loadedExternals+"/"+this.totalExternals);
};
}
Output is this: Loaded 1: NaN/undefined Loaded 2: 0/0 Could someone help me fixing "Loaded 1"? Thanks a lot Hi, I'm very new to javascript and I need your help. What I'm trying to do is: I have a html file with javascipt embeded in, in this file I want to use a table object in another javascript file. How do I access this object? Your help is very much appreciated. Regards, lep2 Here is the scenario friends, I have an html page which I load it on a server. I give the URL of this page to my clients. My clients have their digital certificate in their web browsers. There is some data on the html page which is filled by the clients. When the client hits the submit button, a java script should run from behind which should be able to pick up the digital certificate of the client which is laoded on their web browser. This information must be sent along with the data to the server. Is it possible to do this using Java script? Can we access Certificates on a system via Java script? Are there any API calls which can be used in Java script for this purpose? Any help will be appreciated. Thank you for your time. Regards, Rocky This is a question more about an ASP.NET web application, but javascript is involved, so I'm hoping some javascript gurus can assist me. I'm working with a web application that needs to get access to an ASP.NET web control (a button) in javascript. The problen is that since the control is run on the server, javascript can't access it in the standard way (i.e. document.getElementById(controlId); ). I've actually solved this problem before in a different application, but my solution there doesn't seem to work here for some reason. I have this in an aspx file: Code: <script...>
...
function myfun()
{
var b = document.getElementById("<%=SaveButton.ClientID%>");
alert(b);
}
</script>
...
<asp:Button ID="SaveButton" Text="save" OnClientClick="myfun()" ClientIDMode="Static" runat="server" UseSubmitBehavior="False" />
I have a designer class in which the button is declared (and therefore exists in the server-side codebehind): Code: protected global::System.Web.UI.WebControls.Button SaveButton; But when I click on my button, the alert box says "null". Why am I not able to get my button in the javascript function? Some things to note: *The button exists within a content tag: Code: <asp:Content ID="Content1" ContentPlaceHolderID="ContentPlaceHolder1" runat="server"> *I'm working within Visual Studios 2008. I am a relative javascript newbie. I wish to detect when a user is leaving a page, and want to know what s/he is doing to leave that page (browser BACK vs. clicked URL), and would like to be able to get this information from the ... document? Where is it held? How can I know this from within my script? Thanks Eric I am starting a new project soon. Now, the project is still in the stage of planning. But I am quite confuse now which programming language to implement. I am going to design a system where the normal users will update the data with the system while the data required changes will need system administrator to apporve it. I will need a database to keep those records (the data required update) so that the system admin can refer to the database and make changes. Do I have another choice instead of using Microsoft Access 2007 macros or VBA ? I prefer a web-based programming. Any suggestion, please ? I have two servers jboss and ejabbered and i have deployed two html files, one on each as follows: testdirver.html deployed on ejabbered <html><head> <script> function viewmembers() {var w=window.open("http://192.168.56.134:8080/nkms1/kms/test.html");} </script> </head> <body><form name="sub" > <input type="text" id="to" name="to"> <button onClick= "viewmembers();"> </form></body></html> test.html on jboss <html> <script> function abc() {alert(window.opener.document.forms[0].to);} </script> <body onload=abc();></body></html> Problem: window.opener.document gives the js error "Access is Denied" which i am not able to understand. Exchanging the two files on the servers(i.e. testdriver.html on jboss and test.html on ejabbered works fine and i get the output [object]). So i am guessing there is something that has to do with the ejabbered server Hi, Is is possible to access a global variable for use inside a function? Thanks for help in advance Mike I have a JavaScript function that Clears the values in all of the elements. This works fine, however, I want to modify the scriipt to clear some of the elements and leave the others alone. I seem to be having a problem getting the function to recognize the elements. (See Code). Code: function ClearAllControls() {
for (i = 0; i <= document.forms[0].length; i++) {
doc = document.forms[0].elements[i];
//alert(doc.name + " - " + doc.type);
switch (doc.type) {
case 'text':
doc.value = ''; break;
/* switch (doc.name){
default:doc.value = '';
}*/
case 'textarea':doc.value = ''; break;
case 'checkbox':doc.checked = false; break;
case 'select-one':
//doc.options[0].selected = true;
//alert(doc.name + " - " + doc.type);
switch(doc.name){
case 'uwtBSSignUp$_ctl0$ddlmodel':alert(doc.name + " - " + doc.type); break;
case 'uwtBSSignUp$_ctl0$ddlbuilding':break;
case 'uwtBSSignUp$_ctl0$ddlfloor'break;
default:doc.options[0].selected = true; break;
}
break;
default:break;}
}
var webTab = document.forms[0].getElementById('uwtBSSignUp');
if(webTab){alert('found');return;}
}
The nested switch statement is failing. The uwtBSSignUp element is a Infragistic Tab Control. I'm trying to prevent some of the controls on the tab panels not to clear. In addition the function doesn't run the alert to notify me that the tab control was recognized. If I run just the first switch statement it works and clears all of the elements. Am I using the right syntex or something? Hey All, So im am putting together a website where i will have two javascript elements close together a simple drop-down navigation bar and an image viewer. The only problem is that when the drop down menu appears it is cut off by the image viewer and doesnt display in front of it. Does anyone know a line of code or solution to this? here are the urls for reference where overlapping isnt a problem: http://www.spectracompany.com/Template/TemplateAlt.html where the menu is cut off: http://www.spectracompany.com/Projec...n-Center1.html Thanks for helping!!! |
|||||||