I'm trying to put 2 page up on a server and have 1 page read/write to the other.
example:
page 1: put "test" in the form.
page 2: displays "test". If anyone tries to access it, it displays "test".
for this reason, I couldn't use simple javascript and php that I know of.
I started googling some ways to do this and see html5 server sent event, but not sure how to go about it. Can someone help me?
Thanks
Edit: Adding code that I've tried
<!DOCTYPE html>
<html lang="en">
<head>
<title>HTML5 Server-Sent Events</title>
<script type="text/javascript">
window.onload = function(){
var source = new EventSource("server_time.php");
source.onmessage = function(event){
document.getElementById("result").innerHTML = "New time received from web server: " + event.data + "<br>";
};
};
</script>
</head>
<body>
<div id="result">
<!--Server response will be inserted here-->
</div>
</body>
</html>
Now this reads from server_time.php but server_time automatically gets the time from the server. I'm not sure how to go about this. This might not be the right approach to what I'm trying to do.
Related
Hello I am new to JavaScript. I have looked through other posts but I cannot resolve my issue.
Earlier I was attempting to play around with the following script found here (How to read text file in JavaScript).
I got it working successfully SEVERAL times:
<!DOCTYPE html>
<html>
<head><meta charset="utf-8" />
<title>Read File (via AJAX)</title>
<script type="text/javascript">
var reader = new XMLHttpRequest() || new ActiveXObject('MSXML2.XMLHTTP');
function loadFile() {
reader.open('get', 'test.txt', true);
reader.onreadystatechange = displayContents;
reader.send(null);
}
function displayContents() {
if(reader.readyState==4) {
var el = document.getElementById('main');
el.innerHTML = reader.responseText;
}
}
</script>
</head>
<body>
<div id="container">
<input type="button" value="test.txt" onclick="loadFile()" />
<div id="main">
</div>
</div>
</body>
</html>
While testing this script, all of a sudden it stopped working! I have assured that my content blockers are disabled and javascript is enabled on my web browsers. I am not sure if I locked up my web browsers ability to use javascript while using this XMLHTTPREQUEST or possibly overloaded it. I even tried inserting a reader.abort() function to possibly close the request if it was still open somehow. I tried inserting alert() functions to troubleshoot that did not work. I tried restarting my computer that did not work. I am using a MAC and have tried the latest versions of Firefox, Chrome, and Safari which all do not work with javascript now.
It is so bad that I CAN'T even get this simple javascript example to work.
<!DOCTYPE html>
<html>
<head>
<title>Test</title>
<script type=“text/javascript”>
document.write(“<h1>This is a test</h1>”);
</script>
</head>
<body>
</body>
</html>
PLEASE HELP! I don't know what I did or how to fix the issue.
Above script works only if you're loading the text file from a server. Make sure the file is located in the same place as your html file on the server and load the page with your server address. Most likely thing you're doing wrong is you're trying to access client's file. It doesn't work because that will be HUGE security breach, only the client can send you a file to read (If that is your intended purpose, then I advise you to use FileReader, example code can be found here).
About your second script, you're using “ instead of ".
<!DOCTYPE html>
<html>
<head>
<title>LearnJS</title>
</head>
<body>
<script>
console.log('hello World\nThis is me');
alert("This is an \nalert.");
</script>
</body>
</html>
I have tried this code and run in TORCH borwser... The only output shown is alert But it doesn't display output of console.log...
What is the possible solution...
I have use
document.write('hello World\nThis is me');
But this code doesn't feed new line so i was supposed to use console.log...
It is working fine here :). Run Code Snippet
<!DOCTYPE html>
<html>
<head>
<title>LearnJS</title>
</head>
<body>
<script>
console.log('hello World\nThis is me on console');
alert("This is an \nalert.");
document.write("This is an document.write.");
</script>
</body>
</html>
Note:
developers use console.log() for logging useful information on browser console
document.write() modifies what user sees in the browser by adding additional content to DOM.
alert()'s are used to alert end users who access the web page on browser.
N.B If you're in confusion about How stackoverflow.com shows console.log() on a browser div. Then see here https://stackoverflow.com/a/20256785/1138192 it is kind of overriding the default behavior of console.log() to show the messages on browser div. Hope this helps :)
console.log() only displays in the developer console of the browser. It does not display on the web page itself.
Your code is not feeding a new line because \n only shows in the source code not on the page. To display a new line in HTML on the page you need to use a <br> tag or use other form of spacing.
So, instead of:
document.write('hello World\nThis is me');
You could use:
document.write('hello World<br>This is me');
However, rather than using document.write(), you may prefer to write to a specific element in the page. Below I give an element an id of data and then use the JavaScript code to write to this element.
<!DOCTYPE html>
<html>
<body>
<div id="data">You can put text here or leave it blank. It will be replaced.</div>
<script>
document.getElementById("data").innerHTML = "Hello world<br>This is me";
</script>
</body>
</html>
Notice also, I need to place the document.getElementByID("data") script after the div is created. If I place it before it will not be able to find it. The script code is therefore placed at the end of the <body> section. There are better ways to do this (such as placing JavaScript code in an external file and using defer), but for your purposes this should work quite well.
I need to have the Javascript written by the user on one page to be saved and used for the next page. By this, I mean, I need to grab the contents of a div, and somehow save that into a .JS file, which wil automatically run as the next page loads. Is there a way in which I could do this, Or is there another way in which this could be achieved?
Basically, something along the lines of what Codecademy has done, but not live?
If you are just working on a local project (nothing server side). you could store the value to localStorage.
// page 1
<!DOCTYPE html>
<html>
<body>
<div contentEditable="true" id="i1"></div><button id="b1">open next page</button>
</body>
<script>
var div = document.getElementById('i1'), text = "desired value";
div.innerText = text;
document.getElementById('b1').onclick = function(){
localStorage['div value'] = div.innerText; window.open('page2.html'); window.close('page1.html');
}
</script>
</html>
// page 2
<!DOCTYPE html>
<html>
<body>
<p id="p"></p>
<button id="b2">go back</button>
</body>
<script>
p.innerText = localStorage['div value']? localStorage['div value']: "There is no value in your div";
b2.onclick = function(){ window.open('page1.html'); window.close('page2.html'); }
</script>
</html>
If you are ready to change the architecture, I have a question as your answer. Have you tried single page JS applications through AngularJS, EmberJS, Backbone etc?
you don't need to save into a .JS file
you need to post the JS to the server, then render it to the next page
i'm the next page
<script>
// user's code
</script>
It seems that firefox has disabled the ability to run a javascript: from the URL...does anybody know of a way around this?
My site requires an id pulled from the html of another site when that user is logged in. Instead of having the user search the 'view source' page I devised a javascript link to scrape it and send it to the site automagically, but it doesn't work on firefox.
The actual code I'm trying to run:
javascript:void(window.open('http://mysite.com/login?u=' + encodeURIComponent(window.location) + '&s=' + SessionId));
Scrapping the session id from the game in order to pull data for the player, nothing like a facebook hack or anything malicious.
I'd have to see your code but you really shouldn't have a problem doing what you're attempting to do. If you need another option though I have one you could try. If the content of the page you're scraping is within the same domain as your other site you could use an iframe to get the ID.
Here's some code to consider:
Your data collecting page:
<!DOCTYPE html>
<html>
<head>
<title>Disable Firefox 7.0.1 javascript in url security</title>
<script type="text/javascript">
function scrapeData() {
var frame = document.getElementById("otherPage");
var otherPagesObj = frame.contentWindow.document.getElementById("otherContent");
alert("Your data: " + otherPagesObj.innerHTML);
}
</script>
</head>
<body onload="scrapeData();">
<iframe id="otherPage" src="otherpage.htm" width="1" height="1" />
</body>
</html>
Your page to be scraped (otherpage.htm):
<!DOCTYPE html>
<html>
<head>
<title>Other Page - Disable Firefox 7.0.1 javascript in url security</title>
</head>
<body>
<div id="otherContent">1</div>
</body>
</html>
Using the above code you can see "1" alerted from the div of another page. This is a simple, cross-browser compatible option for what you're attempting to do.
Hope this helps.
I have an open web page dialog. From there, what I'd like to do is when the user clicks on a link, refresh the contents of the dialog with modified query string parameters. The problem I am running into is that rather than refresh the same web page with new parameters, a new browser window pops up.
Here is the page used to open the dialog:
<!DOCTYPE html>
<html>
<head>
<title></title>
<script type="text/javascript">
function ShowPopup() {
var popWinFeatures = "dialogWidth: 800px;dialogHeight:600px;center:yes;status:no;scroll:no;resizable:yes;help:no";
window.showModalDialog("webPageDialog.html","PopUpWin",popWinFeatures);
}
</script>
</head>
<body>
Click For Modal
</body>
</html>
and this is the code within the webpage dialog that attempts to refresh the webpage with changed query string parameters:
<!DOCTYPE html>
<html>
<head>
<title></title>
<script src="scripts/jquery-1.6.4.js" type="text/javascript"></script>
<script type="text/javascript">
$(document).ready(function(){
var queryString = "?ab=123";
var newURL = window.location.protocol + "//" + window.location.host + "/" + window.location.pathname;
$('#testLink').attr('href', newURL+queryString);
});
</script>
</head>
<body>
Please Click Me
</body>
</html>
I've also tried using window.open as well as setting window.location. And I've also tried setting window.location.href but the result was the same.
the new browser window displays exactly what I expect. It's just not in the same window.
Thoughts?
Since posting this question, I came up with two possible solutions. In case anyone comes after me and wants to know what I ended up doing, here you go!
The first was just to make the popup non-modal. Removing the modal piece gave me the behavior exactly like I expected it. This didn't work in my situation however for a different reason... It seems that the session cookie was not carried over which in this web app, would cause the log-in page to be displayed before then displaying the correct page. This struck me as odd, but ran out of time to investigate why that was happening.
Second (and this is the solution i ended up going with) was to use an iframe, and display what i needed within the iframe. Definitely not my favorite, but it works!