Grab control value from separate file in ASP website? - javascript

I have two separate .aspx files that are used in one web page. One for the header and the other for the body. In the javascript for the body file, how would I grab the value of an asp:label control from the header? It's name is "lblName", so I tried simply document.getElementById("lblName").value and I received the error:
Microsoft JScript runtime error: Object required
This site is written in Visual Basic, so I'm wondering if anyone knows how to do this from the code behind as well.
If I hit F12 in the browser (IE) this is the hierarchy I see:
<head>
<frameset rows="147,*" frameBorder="no" frameSpacing="0">
<frame name="frHeader" id="frHeader" src="DistHeader.aspx?statProducer=0707090003" noResize="noresize" scrolling="auto">
DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN"
<html>
<head>
<body topMargin="1" rightMargin="0" bottomMargin="0">
<div class="clsNoPrint">
<div class="clsNoPrint">
<table width="100%">
<tbody>
<tr class="clsNameBar" width="100%">
<td width="*" align="left">
<span class="clsNameBar" id="lblName" style="width: 100%;">

If you have runat="server" on your label than its id in browser will be different from one you see on server.
You must pass its ClinetID to JS somehow. For instance, with Page.RegisterStartupScript or if your JS is a part of aspx file you can do something like this:
document.getElementById('<%=lblName.ClientID %>')
Another problem: I guess lblName is <asp:Lable /> which is converted to span which has no .value, but you can use something like this:
document.getElementById('<%=lblName.ClientID %>').innerHTML
As you are using frames - depending on where your code is located you need to access frame first:
//Chrome, FF
document.getElementById("frHeader").contentDocument.getElementById("lblName")
//IE (it does not support contentDocument and have document instead)
document.getElementById("frHeader").document.getElementById("lblName")
Suppose your code is in outer document, which contains actually contains a frame. But if it is in another frame - you should add window.parent. before document.getElementById

Since this was a website that was created almost ten years ago, we had to go up the ladder in the frameset to get the value we were looking for. The code below was the method used
var el = parent.parent.frames("frHeader").document.getElementById("lblName").innerText;

Related

Can't click on the anchor inside a frame with href value as javascript using selenium

Can't click on the anchor inside a frame with href value as javascript using selenium.
#Note: I could manually click/ call the javascript from IE developer console all looks good. The issue is only through selenium .
Here is the page source like
<html>
<body>
<p>
<iframe name="iframe1" width="100" height="218" src="about:blank" frameborder="0" marginwidth="0" "marginheight="0" scrolling="yes">
<html>
<body>
<div class="className" id="DivName"onmouseover="startLinkHover(0,70)" onmouseout="stopLinkHover()">
<a name="link0" href="javascript:function()" shape=""> This is link 1 </a>
</div>
</body>
</html>
</iframe>
</p>
</body>
</html>
I am working with c# ,IE and selenium
Selenium.WebDriver.IEDriver" version="2.53.1.1"
Selenium.WebDriver" version="3.0.0"
Selenium.Support" version="3.0.0"
IE 11 ( As my web application only support IE)
Here is what i have tried:
As it the page is consisting of iframe
1) I am switching to iframe and find the anchor using the name and click
driver.SwitchTo().Frame(driver.FindElement(By.Name("iframe1"));
driver.FindElement(By.XPath("//a[#name='link0']")).click();
2) I have also tried to extract the href property into a string variable and tried to execute the javascript using Javascript executor.
driver.SwitchTo().Frame(driver.FindElement(By.Name("iframe1"));
var js=driver.FindElement(By.XPath("//a[#name='link0']")).GetAttribute("href");
var jsDriver = (IJavaScriptExecutor)driver;
jsDriver.ExecuteScript(js);
Please excuse if any typos as i don't want to post the html source here i have explained my issue with a sample.
Thank you
Finally i managed to resolve this issue by reloading the project from source control after pointing the .net framework target version to 4.5 instead of 4.52 (not sure why would this be?).
after investigations , it was proved that issue was not with selenium clicking on the element but the execution of java script after that with page loads.

Opening Content in New Frame not Working in Chrome

I'm using Javascript to open a page in a different frame using onclick. I had this working when last tested, but was made aware yesterday that it no longer works in Chrome. I retested the other browsers and its still working as expected. I know Chrome can be a little finicky when it comes to Javascript, I'm just not sure how to resolved.
<asp:HyperLink ID="downloadReport" runat="server">
<img src="images/save.jpg" onclick="javascript:top.frames['main'].location = 'DownloadReport.aspx?<%= url %>';return true;" />
</asp:HyperLink>
What do I need to do to resolve the issue in Chrome? And please refrain from a discussion on why frames are or aren't a good idea. While in most cases things can be accomplished in different ways, there are some specific uses for them still.
Problem solved. I was thinking that Chrome needed to access frames by id where as others could use name or id, that was apparently incorrect. Chrome required the frame name. So on my frameset page I added a name attribute in addition to the id one and everything is working again as needed.
<frameset rows="100,*" border="0">
<frame name="top" id="top" runat="server" />
<frame name="main" id="main" runat="server" />
</frameset>
If you really need to use hyperlink in this scenario, prevent its default behavior by doing return false; instead of return true;
But if you don't need it - just use the image without hyperlink (adding styling for cursor if needed):
<img src="images/save.jpg" onclick="top.frames['main'].location = 'DownloadReport.aspx?<%= url %>'" style="cursor:pointer" />

How to access a <div> from the HTML embedded by <object>

I have a webpage that has several <div> sections ("navcol" and "maincol"). The "navcol" div contains <object data="mypage.html">. Inside mypage.html there are buttons the user can click to select pages to be inserted into "maincol". I need to gain access to the innerHTML of "maincol" in the main page with Javascript, so I can do the insertion (like using an iframe). Can someone put me on the right track?
PS. I am using <object>, because I want to have HTML 4.0 "Strict" and Iframes are not in "Strict", but s are.
From within the page in the object element, you can get access to the upper–most browsing context using:
window.top.document
so you can try:
window.top.document.getElementById('maincol');
no doubt only within limitations imposed by the same–origin policy though.
e.g.
<div id="mailcol">maincol</div>
<div id="navcol">
<object data="foo.html"></object>
</div>
in foo.html:
<button onclick="
alert(window.top.document.getElementById('mailcol').innerHTML)
">button</button>

javascript Error: Permission denied to access property 'u8'

i have a legacy jsp page which has button element . i am using frameset/frames. on click of this button function parent.u8() is called.
But as soon as i click on button,i get below error
Error: Permission denied to access property 'u8'
parent.u8()
Its a big jsp. so i dont want to paste complete content here. I tried to take the bare minimum html markup from server generated html page
and created the html page with similar structure it works fine there.But not in real application.
Just for information there is one iframe elemet also but that is lying altogether in separate frame not in the frame where button exists(so possiblity something related to iframe looks bleak to me).
u8 function lies inside top head Tag. Folks i know its tough to tell what can be exact reason without actual markup but probably you can help
me regarding the possible reasons when can i get this kind of excpetion Permission denied to access property
Update:-
This was working before. Issue began when i started using tinymce(WYSIWYG) editor in one of the frame.Tinymce created one iframe element but that is loaded from appserver only. Pasting below the code generated inside body of one of the frame. May be it helps
<span id="bodyTest_parent" class="mceEditor defaultSkin" role="application" aria-labelledby="bodyTest_voice">
<span id="bodyTest_voice" class="mceVoiceLabel" style="display:none;">Rich Text Area</span>
<table id="bodyTest_tbl" class="mceLayout" cellspacing="0" cellpadding="0" role="presentation" style="width: 100%; height: 323px;">
<tbody>
<tr class="mceFirst mceLast">
<td class="mceIframeContainer mceFirst mceLast">
<iframe id="bodyTest_ifr" frameborder="0" src="javascript:""" allowtransparency="true" title="Rich Text AreaPress ALT-F10 for toolbar. Press ALT-0 for help" style="width: 100%; height: 323px; display: block;">
<!DOCTYPE >
<html>
<head xmlns="http://www.w3.org/1999/xhtml">
<body id="tinymce" class="mceContentBody " onload="window.parent.tinyMCE.get('bodyTest').onLoad.dispatch();" spellcheck="false" dir="ltr">
<p>
<span color="blue" data-mce-style="color: blue;" style="color: blue;">
<strong>adain</strong>
</span>
This is usually caused by the frames existing on different origins (e.g. domains). JavaScript is not allowed to access data from different origins for security reasons.

writing html bean within JavaScript

hey Guys,
I am trying to write dynamic html bean using java script
but I keep geting the "function is not found" JS error when I press the button ..
here is a sample code
<html>
<html:form action="loginAction.do" >
<head>
<script type="text/javascript">
function test(){
document.getElementById('dd').innerHTML =
"<html:text property='pid'/>";
}
</script>
</head>
<body>
<table align="center">
<tr>
<td align="center">
<input type="button" value="addprod" onclick="test()"/>
</td>
</tr>
<tr>
<td align="center">
<div id="dd"></div>
</td>
</tr>
</table>
</html:form>
</body>
</html>
I don't know about the
<html:form action="loginAction.do" >
where it should be located
I tried to locate it within the <body>
but I got a big exception due to writing <html:text property='pid'/> in JavaScript outside the <html:form>
...
need your help,
Regards,
I think struts is trying to parse the <html:text /> as a tag in your script, rather that just a javascript string. Try moving the <html:form action="loginAction.do" > into the body AND the <script> within the <html:form> similar to this fiddle http://www.jsfiddle.net/pL4Aq/1/
However, it works in the fiddle because it is just straight HTML... I don't think what you are trying to do will work. <html:text > is a custom tag that gets processed on the server, does a bunch of stuff, and then generates HTML for you. You will never actually see <html:text> if you view the source from your browser, even though it is in your jsp.
You might want to try changing the <html:text > to a straight <input type="text"> tag (in which case, you could just move the <html:form> into the body and leave the script where it is).
I am completely agreed with what Mike is saying.
Writing <html:text> inside javascript is useless since javascript is executing on client side while struts is required to translate this tag to html tag.
Better to write <input type="text"> inside javascript and keeps its name as "prop" if you want struts to fill the value of that text inside the form bean property "prop". Keep the <html:form in body tag. This will work for you.
It should work in a <body> tag.

Categories