Hello and thank you for reading my post.
Here is what I basically want to do:
in a first HTML page ("parent.html"), there is a button ;
when a user clicks the button a new window pops up ("child.html")
AND the contents of a "div" element in the child window is updated.
The final action is unsuccessful under "Firefox" and "Chrome".
parent.html
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>Parent window document</title>
</head>
<body>
<input
type="button"
value="Open child window document"
onclick="openChildWindow()" />
<script type="text/javascript">
function openChildWindow()
{
var s_url = "http://localhost:8080/projectroot/child.html";
var s_name = "ChildWindowDocument";
var s_specs = "resizable=yes,scrollbars=yes,toolbar=0,status=0";
var childWnd = window.open(s_url, s_name, s_specs);
var div = childWnd.document.getElementById("child_wnd_doc_div_id");
div.innerHTML = "Hello from parent wnd";
}
</script>
</body>
</html>
child.html
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>Parent window document</title>
</head>
<body>
<div id="child_wnd_doc_div_id">child window</div>
</body>
</html>
IE9 => it works.
Firefox 13.0.1 => it doesn't work. Error message: "div is null".
Chrome 20.0.1132.47 m => doesn't work.
Do you understand that behaviour?
Can you help me make it work in these three cases?
Thank you and best regards.
I think that the window/document is not loaded at the time when you try to access the elements from it. You can do something like
childWnd.onload = function() {
var div = childWnd.document.getElementById("child_wnd_doc_div_id");
div.innerHTML = "Hello from parent wnd";
}
Also you can take a look at the mdn doc.
A better approach to the problem may be to do the changes in the 'child'. You can access the parent window with window.opener. But you should keep in mind that the parent window could be closed so you should consider some type of local storage (e.g. cookie).
Related
I am trying to setup a D3 project and I want to color the visBdy div at the start. But the selection doesnt seem to be grabbing the visBdy div, it grabs html, even if I spell it wrong.It steps through the code and I do get the var, its just wrong (I think) Must be something simple....
setup();
function setup() {
var bd = d3.select(".visBdy");
bd.style("color", "red");
bd.style("background-color", "green");
}
<!DOCTYPE html
PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3./TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<head>
<title>CCC</title>
<link href="css/vis.css" rel="stylesheet" type="text/css" />
</head>
<body>
<script src="http://d3js.org/d3.v3.min.js" charset="utf-8"></script>
<script type="text/javascript" src="js/app.js"></script>
<div class="visMnu">XXX</div>
<div class="visBdy">XXX</div>
</body>
</html>
Nokogiri isn't grabbing anything beneath the iframe tag.
doc.search("iframe") returns only the iframe tag. doc.search("body.content-frame") returns empty. doc.errors returns empty also. Why isn't Nokogiri registering the HTML beneath the iframe? How can I grab it?
<html lang="en" xml:lang="en" xmlns="http://www.w3.org/1999/xhtml">
<head></head>
<body onunload="clearMyTimeInterval()">
<iframe id="content-frame" frameborder="0" src="/sportsbook/betting-lines/baseball/2014-08-21/?range=day" onload="javascript:checkLoadedFrame(this);" style="background-color: rgb(34, 34, 34); height: 1875px;" name="content-frame" scrolling="no" border="0">
#document
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html lang="en" xml:lang="en" xmlns="http://www.w3.org/1999/xhtml">
<head></head>
<body class="content-frame">
#ETC.......
That's because the contents of the iframe are not part of the page. In fact, they are in a completely different location (note the src attribute of the iframe). You'll have to fetch that content separately, which is how a browser would do it.
Here is code that handles it:
page = Mechanize.new.get "http://page_u_need"
page.iframe_with(id: 'beatles').content
Im newbie to Ajax and need to load a test file contents from the server,
Here is my html page and views.py
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1">
<title>Insert title here</title>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js">
</script>
<script>
$(document).ready(function(){
$("#test1").click(function(){
$("#test2").load("demo_test.txt");
});
});
</script>
</head>
<body>
<div id="test1">This is first block</div>
<div id="test2">This is second block</div>
</body>
</html>
views.py
def ajax_page(request):
variables = RequestContext(request)
return render_to_response('ajaxtest.html',variables)
urls.py
(r'^ajax/$',ajax_page),
When I run it and debug using the IE debugger, I get the msg,
"GET /ajax/demo_test.txt HTTP/1.1" 404 3295
Question:
Can I get a file from the server a load it in test-2?..How can I specify the location of the file to the server?
Please try this:
Create a view to return the demo_test.txt:
def demo(request):
return render(request, 'demo_test.txt')
And create a url to fetch the above by the .load() method:
url(r'^demo/$', 'app.views.demo'),
In your script, pass the url to the .load() method:
$(document).ready(function () {
$("#test1").click(function () {
$("#test2").load(/demo/);
return false;
});
});
Error Line 18, Column 19: document type does not allow element "div" here; assuming missing "object" start-tag
Please see the page source below
<!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>
<title></title>
<meta name="keywords" content="Karnataka,Bangalore_Rural,Healthcare,Office_Assistant,Kerala,Ernakulam,IT_Hardware_Networking,Engineer,Sales___Marketing,Executive,Maharashtra,Mumbai_City,Retailing,Manager,Kollam,CRM_CallCentres_BPO_ITES_Med.Trans,Customer_Care,Hotel_Travel_Tourism_Airlines_Hospitality,Front_Office_Staff,Andhra_Pradesh,Hyderabad,IT_Software,Java_Developer,Pathanamthitta,Manufacturing_Industrial,Educational_Training,Teacher,Engineering_Projects"/>
<meta name="description" content="The best job oriented resume sharing system. Create and Publish your online resumes for FREE. Search and apply your dream jobs for FREE. Post your jobs for FREE."/>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1"/>
<div id="fb-root"></div>
I do believe you need to put the < div > inside a < body > section.
I simply cannot find an object in DOM using Firebug (FF).
I want to see elrteOptions object in DOM. I right-click "Inspect Element" on the page, going to DOM tab and typing elrteOptions in the search box. No results.
How to I see it? =)
Thanks.
Code is as simple as:
<!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>some</title>
<script src='js/jquery.min.js' type='text/javascript'></script>
<script type='text/javascript'>
$(document).ready(function() {
var elrteOptions = {
cssClass : 'el-rte',
lang : 'ru',
toolbar : 'maxi',
cssfiles : ['styles/elrte-inner.css']
}
});
</script>
</head>
<body>
test
</body>
</html>
Looks like it had something to do with the browser (Firefox 9.0.1).
After complete re-install: objects started to appear normally.