We Keep Coding

Javascript loaded by an Ajax call doesn't execute?

I´m trying to implement html code with Ajax-get into my temp-page.
This works as it should, only the javascript isn´t executed as I expected. If I load the code independently in the browser, then the javascript executes as expected. If it's implemented with Ajax in my temp-page it doesn´t. Why?
Here is the html and javascript code I'm loading:
<link rel="stylesheet" type="text/css" href="/x/x/x/x/stylesheet.css">
<div id='content_Box'></div>
<script type="text/javascript" src="/x/x/x/x/javascript.js" charset="utf-8"></script>
And here is the ajax code which loads it:
var xhttp = new XMLHttpRequest();
xhttp.onreadystatechange = function() {
if (this.readyState == 4 && this.status == 200) {
content_Box.innerHTML = "";
content_Box.innerHTML = this.responseText;
}
};
xhttp.open("GET", Pfad, true);
xhttp.send();
Thank you for your time!

Your problem is not with the ajax call.
The issue is that
content_Box.innerHTML = this.responseText;
doesn't cause any scripts to execute.
See Executing <script> elements inserted with .innerHTML for some code that looks at the text, finds the scripts, and executes them.

It may depend on what your js actually does.
Anyway you can call the functions once you have loaded the ajax response (in xhttp.onreadystatechange) to make sure to run them at least once also on the parts you got from the response.

Ajax refresh does not refresh the Java script

I have a JSP page that refreshes every 5 seconds Using ajax.
The page i am calling having javascript that is not getting refreshed .
Please tell me how to achieve that.
Below is the code i am using to refresh that page .
refresh is the name of the div where i am displaying the data.
<script type="text/javascript">
function AutoRefresh() {
var xmlHttp;
try {
xmlHttp = new XMLHttpRequest(); // Firefox, Opera 8.0+, Safari
} catch (e) {
try {
xmlHttp = new ActiveXObject("Msxml2.XMLHTTP"); // Internet Explorer
} catch (e) {
try {
xmlHttp = new ActiveXObject("Microsoft.XMLHTTP");
} catch (e) {
alert("No AJAX");
return false;
}
}
}
xmlHttp.onreadystatechange = function () {
//alert("hi");
if (xmlHttp.readyState == 4) {
document.getElementById('TotalRoutes').innerHTML = xmlHttp.responseText;
setTimeout('AutoRefresh()', 10 * 1000); // JavaScript function calls AutoRefresh() every 3 seconds
}
}
xmlHttp.open("GET", "QAGENIE.jsp", true);
xmlHttp.send(null);
}
</script>
Here js files in the QAGENIE.jsp page is not getting refreshed on the ajax call

I think you are not calling AutoRefresh function first time. so nothing will be execute. and if you are calling from outside of your code which you gave here, then please post whole web page code in question.

setTimeout(AutoRefresh,5000); for every 5 seconds
if (xmlhttp.readyState==4 && xmlhttp.status==200)
window.onload = AutoRefresh();

When you call document.getElementById('TotalRoutes').innerHTML=xmlHttp.responseText;, script tags inside the "QAGENIE.jsp" are not executed, that's why:
js files in the QAGENIE.jsp page is not getting refreshed.
Since the question is tagged with jQuery, you could try $.ajax and $.html. Like this:
function AutoRefresh(){
$.ajax({
url:"QAGENIE.jsp"
})
.done(function(response){
$("#TotalRoutes").html(response);
setTimeout(AutoRefresh,10*1000);
});
}
AutoRefresh(); //call this to trigger the first call
$.html automatically parses and executes script tags in the response HTML.
There is 1 more thing to notice is browser cache, if your js files are cacheable (as it usually does by the cache response header from server), the js files may be served from the cached. If you need to always refresh with new js files, ensure your js files are not returned with a cache header, or try to append a random string at the end of the script tags. Like this:
<script src="yourFile.js?[randomstring]"></script>

Ajax Function Only Working Part of the Time

I am using the following Ajax function format:
var xmlhttp;
function addAddress(str)
{
if (window.XMLHttpRequest)
{
xmlhttp = new XMLHttpRequest();
}
else
{
xmlhttp = new ActiveXObject("Microsoft.XMLHTTP");
}
xmlhttp.onreadystatechange = function()
{
if (xmlhttp.readyState == 4 && xmlhttp.status == 200)
{
//specific selection text
document.getElementById('info').innerHTML = xmlhttp.responseText;
}
}
var addAddress = "add";
xmlhttp.open("POST", "sys.php", true);
xmlhttp.setRequestHeader("Content-type", "application/x-www-form-urlencoded");
var queryString = "&addAddress=" + addAddress;
xmlhttp.send(queryString);
}
function GetXmlHttpObject()
{
if (window.XMLHttpRequest)
{
return new XMLHttpRequest();
}
if (windows.ActiveXObject)
{
return new ActiveXObject("Micorsoft.XMLHTTP");
}
return null;
}
Up until now, all of my Ajax functions, like the one above, have been running fine. However, now the function will work only sometimes. Now, sometimes I will have to click the onclick event a couple times to execute the function or the function will just hang, and then after about 4 minutes it will execute.
I tested parts of the function and found that the issue lies some where at the:
if (xmlhttp.readyState == 4 && xmlhttp.status == 200)
{
alert(xmlhttp.status);
//specific selection text
document.getElementById('info').innerHTML = xmlhttp.responseText;
}
When the function works, I can alert(xmlhttp.status) and get 200. However, when it's not working, the alert box doesn't even trigger. In fact, nothing happens, not even an error.
Could this be a server issue? I am kind of thinking my website got hacked, but I cannot find any issues accept that the Ajax functions are not executing properly.
Lastly, I do not get this problem on my localhost, it's only happening on the live website.
Any help will be greatly appreciated.
Thanks

First just confirm that the addAddress function is actually being called when you click the button or control that should trigger it.
Just a simple alert in the first line like this would work:
function addAddress(str)
{
alert('addAddress has been called!')
....
}
If you don't get the alert, make sure there isn't a javascript error on the page that is preventing the function from running. In firefox you press CTRL+SHIFT+J to see the error console for example.
If that part is working, trying putting the URL for the ajax request directly into your browser and diagnose it that way.
Looks like you are requesting this url with ajax:
sys.php&addAddress= (address goes here)
Check that the page will load directly in your browser. If not, the problem is not the ajax request, but something with the sys.php page itself - which you can then drill down on.
Hope that helps!

This wasn't the answer I was expecting, but I ended up having my web host (GoDaddy) change servers, and that resolved the problem. For almost a year, I was running IIS7 with PHP. Since I had never run into any problems, I just continued using that server. After the Ajax latency issue and not being able to figure out a solution, I figured I would just switch over to Apache. After the change, everything started running smoothly again.
I am thinking maybe there was a software update that I was not notified about. Or, maybe my website was getting hit with a DDoS, which was decreasing the performance of my Ajax requests. Lastly, maybe someone got into IIS and changed a setting. I don't know, all I know is that the minute the server was changed over to Apache was when the website started running normally again.
Thanks for everyone's suggestions.

Updated ... need an Ajax example about how client side gets a value from the server side w/o postback

basically I want to check whether a user is logged in with javascript when a button is clicked
I know ajax can do this, but I have no idea where to start... and I do not want to learn the whole ajax
is there any simple code sample I can "borrow"?
==============================UPDATE 2===================================
I posted another question for this one and get the answer below... in case someone has the same question as me...
Can I return true to asp.net OnClientClick After an Ajax call? Or maybe some other way?
==============================UPDATE=====================================
I read a few examples but I just cannot find the exact one I need. I can get the result from the server side and then... stuck... here is my code and please help with the questions in the comments. Thanks a lot!!!
in .ascx:
<asp:Button ID="buttonSubmit" Text="Submit" OnClientClick="return buttonSubmitOnclick()" OnClick="buttonSubmit_Click" runat="server"/>
in .js:
function buttonSubmitOnclick() {
showLogin();
//What to do here??? how to return true if the ajax call return 'true'?
return true; //???
}
//========== Ajax ==============
function showLogin() {
var xmlhttp;
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) {
if (xmlhttp.responseText == "false") {
$find('modalPopupLogin').show(); //Show Login Dialog
};
}
}
xmlhttp.open("GET", "AjaxService.aspx?t=auth", true); //??? should the last parameter be "false"???
xmlhttp.send();
}

This is pretty straight forward. Since you are using asp.net probably the easiest way to do this is with a page method. Page Methods in asp.net allow you to write .NET code in your code behind and then call it using a javascript method. The page method must be declared static/shared since it will be accessed outside of the page life cycle.
Here are some examples:
- http://www.singingeels.com/Articles/Using_Page_Methods_in_ASPNET_AJAX.aspx
- http://encosia.com/using-jquery-to-directly-call-aspnet-ajax-page-methods/
Page Methods are pretty straight forward to call, with or without jQuery.

There is some good information on using Ajax without jQuery at w3 that has a working example of ajax with asp at the end. Not too much reading involved.
Updated for question changes:
At the bottom explains the differences in using asynchronous true vs false.
Using async=true, the JS isn't waiting around for the response so you don't want to handle it 'here':
function buttonSubmitOnclick() {
showLogin();
//What to do here??? how to return true if the ajax call return 'true'?
return true; //???
}
Once the xmlhttp.send() is run, js moves on, returns out of showLogin() and will return out of buttomSubmitOnclick, regardless of if the login response has come back yet.
Assuming async true, as you have it, you'll need to expand the conditional in the onreadystatechange function to handle when the responseText == "true".
xmlhttp.onreadystatechange = function () {
if (xmlhttp.readyState == 4 && xmlhttp.status == 200) {
if (xmlhttp.responseText == "false") {
$find('modalPopupLogin').show(); //Show Login Dialog
}else if (xmlhttp.responseText == "true") {
//Continue the previous/submit action here because we are already authenticated
}
}
}

Adobe AIR and multiple XMLHttpRequests is being... weird

I'm making a small Adobe AIR app (my first) using HTML+Javascript. I need to run more than one asynchronous data request, but the second one didn't seem to be firing (note that the requests were not run concurrently originally). I tried stripping the program down to the bare minimum that exhibited problems, and at first only the first request fired, but then things got strange. Code and output follows:
<html>
<head>
<script type="text/javascript" src="AIRAliases.js"></script>
<script type="text/javascript">
function download(page) {
var url = "http://en.wikipedia.org/w/api.php?action=parse&format=xml&page=" + page;
xmlhttp = new XMLHttpRequest();
xmlhttp.open("GET", url,true);
xmlhttp.onreadystatechange=function(){
if (xmlhttp.readyState == 4) {
air.trace("Done");
}
}
xmlhttp.send(null);
}
function appLoad() {
download("Main Page");
download("Main Page");
}
</script>
</head>
<body onLoad="appLoad()">
</body>
</html>
Expected output:
Done
Done
Actual output:
C:\AIRSDK\apps\HelloWorld>adl HelloWorld-app.xml
Done
C:\AIRSDK\apps\HelloWorld>adl HelloWorld-app.xml
Done
C:\AIRSDK\apps\HelloWorld>adl HelloWorld-app.xml
Done
C:\AIRSDK\apps\HelloWorld>adl HelloWorld-app.xml
Done
Done
Done
Done
Done
Done
Done
Anyone seen anything like this before?

Simple answer, you shouldn't re-use xmlhttprequest objects (even if you don't realise you are because you're a complete noob at Javascript).
This line:
xmlhttp = new XMLHttpRequest();
Should be:
var xmlhttp = new XMLHttpRequest();