syntax error from external javascript - javascript

I'm trying to call an external .js file which will place text into one of my 's.
The script works perfectly when included in the index.php, but when using the following:
<script src="js/updates.js"></script>
into the index.php, it returns a syntax error in the updates.js.
<script type="text/javascript">
xmlhttp = new XMLHttpRequest();
setInterval(chatStatus(),3000);
function chatStatus()
{
xmlhttp.onreadystatechange =
function()
{
if(xmlhttp.readyState == 4 && xmlhttp.status==200)
{
document.getElementById('chatStatus').innerHTML = xmlhttp.responseText;
}
}
xmlhttp.open("GET", "phprequests/chatStatus.php", true); <------ this line returns syntax error.
xmlhttp.send();
}
</script>
Any help is appreciated. How comes this returns syntax error outside of the index.php file?

Removing the script headers from the external .js file solved the issue.
xmlhttp = new XMLHttpRequest();
setInterval(chatStatus(),3000);
function chatStatus()
{
xmlhttp.onreadystatechange =
function()
{
if(xmlhttp.readyState == 4 && xmlhttp.status==200)
{
document.getElementById('chatStatus').innerHTML = xmlhttp.responseText;
}
}
xmlhttp.open("GET", "phprequests/chatStatus.php", true); <------ this line returns syntax error.
xmlhttp.send();
}

Related

Using a AJAX, how do I set the innerHTML of an element that is not yet loaded in the DOM?

There is a main-feed showing a list of blog post titles. When a title is clicked, I need to display the details of the blog post in a new html file. Below is my current code:
window.location.href = "/viewpost.html";
postID = this.id;
if (window.XMLHttpRequest) {
// code for IE7+, Firefox, Chrome, Opera, Safari
xmlhttp = new XMLHttpRequest();
} else {
// code for IE6, IE5
xmlhttp = new ActiveXObject("Microsoft.XMLHTTP");
}
xmlhttp.onreadystatechange = function() {
if (xmlhttp.readyState == 4 && xmlhttp.status == 200) {
document.getElementById("view-post-container").innerHTML = xmlhttp.responseText;
}
};
xmlhttp.open("GET", "viewpost.php?q=" + postID, true);
xmlhttp.send();
The problem is, the element view-post-container, is in the file viewpost.html, and so I don't think the PHP file can access it. I would just display the data on the current page (index.php), but I wanted to have individual pages for each post so I can eventually learn how to have dynamic URL's for SEO and sharing purposes. The end goal is having dynamic urls, so maybe there is a better approach? Any help would is much appreciated. Thanks.
just try this, You have to put your code in on window.onload function
window.onload = function() {
if (window.XMLHttpRequest) {
xmlhttp = new XMLHttpRequest();
} else {
xmlhttp = new ActiveXObject("Microsoft.XMLHTTP");
}
xmlhttp.onreadystatechange = function() {
if (xmlhttp.readyState == 4 && xmlhttp.status == 200) {
document.getElementById("view-post-container").innerHTML = xmlhttp.responseText;
}
};
xmlhttp.open("GET", "viewpost.php?q=" + postID, true);
xmlhttp.send();
}

JavaScript - Inserting into Content section of HTML

I want my program to work like this: When i press a hyperlink in html, i want it to load new content into the "content" section. I have an example code that does this. But I am trying to insert a dygraph inside and I find that the example only passes string. The graph that i was trying to insert did not appear in the content, only basic html appeared (button, background color, etc)
function loadPage(page)
{
if(window.XMLHttpRequest)
{
xmlhttp = new XMLHttpRequest();
}
else
{
xmlhttp = new ActiveXObject("Microsoft.XMLHTTP");
}
xmlhttp.open("GET", page, true);
xmlhttp.setRequestHeader("Content-type",
"application/x-www-form-urlencoded");
xmlhttp.send();
xmlhttp.onreadystatechange = function ()
{
if((xmlhttp.readyState == 4) && (xmlhttp.status == 200))
{
document.getElementById("content").innerHTML = xmlhttp.responseText;
}
}
}
If i'm not wrong, the loadPage function needs to be edited. But i'm not sure how. Hope you guys can answer me in a layman's term.
You need to pass your newly retrieved content to dygraph after you fetch.
function loadPage(page) {
if (window.XMLHttpRequest) {
var xmlhttp = (window.XMLHttpRequest) ? new XMLHttpRequest() : new ActiveXObject("Microsoft.XMLHTTP");
xmlhttp.open("GET", page, true);
xmlhttp.setRequestHeader("Content-type",
"application/x-www-form-urlencoded");
xmlhttp.send();
xmlhttp.onreadystatechange = function () {
if ((xmlhttp.readyState == 4) && (xmlhttp.status == 200)) {
var g = new Dygraph('content', xmlhttp.responseText, [rest of your parameters]);
}
}
}
}

AJAX function( ) part alone not working

After function() it is not working, i don't know why. If I put an alert before that statement it's working but after that statement it isn't working.
<script>
function new_order() {
var xmlhttp;
if (window.XMLHttpRequest) {
xmlhttp = new XMLHttpRequest();
}
alert("asdasd");
xmlhttp.onreadystatechange = function () {
if (xmlhttp.readyState == 4 && xmlhttp.status == 200) {
document.getElementById("order_id").innerHTML = xmlhttp.responseText;
}
}
xmlhttp.open("POST", "item_sort.php?sort=" + str, true);
xmlhttp.send();
}
</script>
3 things you can check
If an element corresponding to id order_id exists on the page
if the str is not null or not defined
If you are using older IE versions IE5 or 6 you need to add the
following in your code.
xmlhttp = new ActiveXObject("Microsoft.XMLHTTP");
Also you need to use the following way if you want to do POST ajax call.
xmlhttp.open("POST", "item_sort.php", true);
xmlhttp.setRequestHeader("Content-type","application/x-www-form-urlencoded");
xmlhttp.send("sort=" + str);

Empty XmlHttp responsetext (only Google Chrome)

I have a problem with my chat script in Google Chrome.
Sometimes the responsetext is empty until you reload the page, but sometimes it's working well. It opens a xmlhttp connection every second and if the first good the ones after that also good.
In Firefox it's always good.
var url = "text.php";
xmlHttp.open("GET", url, true);
xmlHttp.onreadystatechange = myfunc;
xmlHttp.send(null);
function myfunc()
{
if (xmlHttp.readyState == 4 || xmlHttp.readyState == "complete")
{
var msg = xmlHttp.responseText;
alert(msg);
}
}
try this out
var xmlHttp;
xmlHttp=new XMLHttpRequest();
var url = "text.php";
xmlHttp.onreadystatechange = function()
{
if (xmlHttp.readyState==4 && xmlHttp.status==200)
{
var msg = xmlHttp.responseText;
alert(msg);
}
}
xmlHttp.open("GET", url, true);
xmlHttp.send(null);

ajax - Div text not changing

I'm a newbie in AJAX and so I am facing a lot of problems in making a simple AJAX program. I have a button on which I want to do is that when I will click it the text of the div below it changes. I tried so much times but still couldn't find the bug.
Here is my code:
<html>
<head>
<script>
function loadXMLDoc() {
var xmlhttp;
if(!window.XMLHttpRequest) {
xmlhttp = new ActiveXObject("Microsoft.XMLHTTP");
} else {
xmlhttp = new XMLHttpRequest();
}
xmlhttp.onReadyStateChange = function () {
if(xmlhttp.readyState==2 && xmlhttp.status==200) {
document.getElementById('myDiv').innerHTML = xmlhttp.responseText;
}
};
xmlhttp.open('GET', 'textfile.txt', true);
xmlhttp.send();
}
</script>
</head>
<body>
<button type="button" value="Click!" onClick="loadXMLDoc();">Hello World</button>
<div id='myDiv'>hello!</div>
</body>
</html>
And here is the text file:
<p>My name is areeb siddiqui</p>
<p>My name is areeb siddiqui</p>
Any help would be appreciated
Thanks in advance :)
Also here is my webpage : http://mytestingsite.site90.net/ajax/
This should work for you.. this is how i make my ajax requests.. so very similar
function loadXMLDoc() {
var xmlhttp = null;
if(!window.XMLHttpRequest) {
xmlhttp = new ActiveXObject("Microsoft.XMLHTTP");
} else {
xmlhttp = new XMLHttpRequest();
}
xmlhttp.open('GET', 'textfile.txt', true);
xmlhttp.send();
xmlhttp.onreadystatechange = function()
{
if(xmlhttp.readyState != 4 || xmlhttp.status != 200){return;}
document.getElementById('myDiv').innerHTML = xmlhttp.responseText;
}
}
The reason your function was not updating is because onreadystatechange must be all lowercase
Change this block:
if(xmlhttp.readyState==4 && xmlhttp.status==200)
checK onreadystatechange
xmlhttp.onreadystatechange = function () {
if(xmlhttp.readyState==4 && xmlhttp.status==200) {
document.getElementById('myDiv').innerHTML = xmlhttp.responseText;
}
};
Change the onReadyStateChange with onreadystatechange
and xmlhttp.readyState==2 with xmlhttp.readyState==4

Categories