By using this site, you agree to our updated Privacy Policy and our Terms of Use. Manage your Cookies Settings.
459,453 Members | 937 Online
Bytes IT Community
+ Ask a Question
Need help? Post your question and get tips & solutions from a community of 459,453 IT Pros & Developers. It's quick & easy.

Ajax - beginner level (Getting response from server)

P: 23
Hello

I am learning Ajax and I am following the tutorials found but for some reason, my code is not working. I think I am missing something in the code that I am posting below. Please have a look and let me know.

[HTML]<html>
<head>
<script>
function submitForm()
{
var test;
try { test = new ActiveXObject('Msxml2.XMLHTTP'); }
catch (e)
{
try { test = new ActiveXObject('Microsoft.XMLHTTP'); }
catch (e2)
{
try { test = new XMLHttpRequest(); }
catch (e3) { test = false; }
}
}

test.onreadystatechange = function()
{
if(test.readyState == 4)
{
if(test.status == 200)
document.form1.pingtext=test.responseText;
else
document.form1.pingtext=test.status;
}
};

test.open(GET, "ping_test.php", true);
test.send(null);
}
</script>
</head>

<body>
<FORM method="POST" name="form1" action="">
<INPUT type="BUTTON" value="Ping the machine" onclick="submitForm()">
<INPUT type="text" name="pingtext" value="">
</FORM>
</body>
</html>[/HTML]

The ping_test.php has the following code:


[PHP]<?php
$ec =`ping 127.0.0.1`;
echo "<pre> $ec </pre>";

?>[/PHP]

What I want to do is to take an IP Address from the user and ping it. And show the ping results in a div or a textarea on the html page itself without going to another page. But to test, I am using 127.0.0.1 and pinging it. But when I click on Submit - It says Error on Page. I don't know the correct syntax. Can someone let me know where I am going wrong, please?

If someone can tell me how to take user input and pass it also? I just want to learn how to use it on a beginner level.

Thank you.
Nov 21 '07 #1
Share this Question
Share on Google+
15 Replies


gits
Expert Mod 5K+
P: 5,390
hi ...

welcome to TSDN ...

you should pass GET as a string :)

Expand|Select|Wrap|Line Numbers
  1. test.open('GET', 'ping_test.php',  true);
kind regards
Nov 22 '07 #2

P: 23
hi ...

welcome to TSDN ...

you should pass GET as a string :)

Expand|Select|Wrap|Line Numbers
  1. test.open('GET', 'ping_test.php',  true);
kind regards
Hello,

Thanks though I get the same error - Error on Page which I click the button even after the changes done.
Nov 22 '07 #3

acoder
Expert Mod 15k+
P: 16,027
You need to set the value of the input text box:
Expand|Select|Wrap|Line Numbers
  1. document.form1.pingtext.value = test.responseText
Nov 22 '07 #4

gits
Expert Mod 5K+
P: 5,390
You need to set the value of the input text box:
Expand|Select|Wrap|Line Numbers
  1. document.form1.pingtext.value = test.responseText
aaarghh :) ... i missed that ... of course the handling of the response is wrong ...

kind regards
Nov 22 '07 #5

P: 23
aaarghh :) ... i missed that ... of course the handling of the response is wrong ...

kind regards
Still didn't work, Sorry. I think its my bad luck :D

Best Regards...
Nov 22 '07 #6

gits
Expert Mod 5K+
P: 5,390
hmmm ... it should work ... could you post your current code again? could you test it in FF and have a look at the javascript-console and post the error you get?

kind regards
Nov 22 '07 #7

P: 23
hmmm ... it should work ... could you post your current code again? could you test it in FF and have a look at the javascript-console and post the error you get?

kind regards
Sorry my bad. It happens sometimes that when I do so many edits to one file, it does not get refreshed at all and keeps on showing me same old errors. So I deleted that file and pasted the same code in a new file and it works!

Thank you for your quick reply. Hope I will be able to do some scripting in Ajax from now since now I have my first program running. Its something new to learn :)
Nov 22 '07 #8

gits
Expert Mod 5K+
P: 5,390
glad to hear you got it working :) ... post back to the forum anytime you have more questions ...

kind regards
Nov 22 '07 #9

P: 23
glad to hear you got it working :) ... post back to the forum anytime you have more questions ...

kind regards
Hi Again,

Thank you for the help last time. I have another question please. The above code works fine except one thing. If I click on Ping button, the first time, it shows the ping results after properly pinging the machine but if I click on Ping again, the pinging does not happen - as in it does not go to the PHP page which pings the machine. However it does show the last ping results.

Is it because there is a browser cache which knows the last result from server?

I originally thought that everytime that button is clicked, it will call the PHP to check whether the machine is ping-able or not.

Thank you.
- John
Nov 25 '07 #10

P: 23
Hi Again,

Thank you for the help last time. I have another question please. The above code works fine except one thing. If I click on Ping button, the first time, it shows the ping results after properly pinging the machine but if I click on Ping again, the pinging does not happen - as in it does not go to the PHP page which pings the machine. However it does show the last ping results.

Is it because there is a browser cache which knows the last result from server?

I originally thought that everytime that button is clicked, it will call the PHP to check whether the machine is ping-able or not.

Thank you.
- John
Important: This happens even if I refresh the page.

Though I added some extra code to display an image while the ping results are back to the client and a Clear button to empty the div contents.


[HTML]
<html>
<head>
<script>
function clearForm() //new function to clear the ping result div
{
document.getElementById("ping").innerHTML="";
}
function submitForm()
{
var test;
try { test = new ActiveXObject('Msxml2.XMLHTTP'); }
catch (e)
{
try { test = new ActiveXObject('Microsoft.XMLHTTP'); }
catch (e2)
{
try { test = new XMLHttpRequest(); }
catch (e3) { test = false; }
}
}




test.onreadystatechange = function()
{
if(test.readyState == 1)
{
document.getElementById('ping').innerHTML = '<img src="wheel.gif"><br />Please allow approx 5 seconds...';

}
if(test.readyState == 4)
{
if(test.status == 200)
document.getElementById("ping").innerHTML=test.res ponseText;
else
document.getElementById("ping").innerHTML=test.sta tus;
}
}

test.open('GET', 'ping_test.php', true);

test.send(null);
}
</script>
</head>

<body>
<FORM method="POST" name="form1" action="">
<input type="text" name="path" />

<INPUT type="button" value="Ping the machine" onclick="submitForm();">
<input type="button" value="Clear" onclick="clearForm();">
<div id="ping">

</div>

</FORM>
</body>
</html>[/HTML]
Nov 26 '07 #11

acoder
Expert Mod 15k+
P: 16,027
This seems like a caching problem.

For "ping_test.php", add the date/time to get a fresh result each time:
Expand|Select|Wrap|Line Numbers
  1. test.open("GET","ping_test.php?rnd="+new Date().getTime(),true);
Nov 26 '07 #12

P: 23
This seems like a caching problem.

For "ping_test.php", add the date/time to get a fresh result each time:
Expand|Select|Wrap|Line Numbers
  1. test.open("GET","ping_test.php?rnd="+new Date().getTime(),true);
Thank you Acoder. Its working again. However, could you please help me out with some good links with examples which are a bit complex or recommend some books.

Well, this was a specific problem and I thought Ajax will process the pinging code everytime. That is what I understood from the term Ajax and readystate but not sure if I am reading the right content. Because I would like to study into detail. Also, if I have to do web programming on a longer term, is it better to use Prototype or JSON or other existing libraries. Or should I stick to this standard way of using javascript and PHP using Ajax style. Its a long shot for me to learn these but I am keen to learn. Please advise.

Thanks very much.
Nov 26 '07 #13

acoder
Expert Mod 15k+
P: 16,027
Also, if I have to do web programming on a longer term, is it better to use Prototype or JSON or other existing libraries. Or should I stick to this standard way of using javascript and PHP using Ajax style. Its a long shot for me to learn these but I am keen to learn. Please advise.
Prototype is a JavaScript framework. JSON is a data-interchange format like XML.

Using frameworks and libraries usually take care of browser problems and can make things easier. It depends on your requirements.
Nov 26 '07 #14

P: 23
Prototype is a JavaScript framework. JSON is a data-interchange format like XML.

Using frameworks and libraries usually take care of browser problems and can make things easier. It depends on your requirements.
Cool thanks! I will make note of it.
Nov 26 '07 #15

acoder
Expert Mod 15k+
P: 16,027
No problem. Post again if you have any more questions.
Nov 27 '07 #16

Post your reply

Sign in to post your reply or Sign up for a free account.