We Keep Coding

How can I pass data from client to server use raw AJAX?

Hello I have already search but they often use jquery ajax to pass data from js to PHP(server-side). but for my project it has a bunch of pure js code so I should use raw AJAX to pass data.
For example, if I want to send a variable "Imgname" that value = 13 and want to echo in php page.
this is my try
<script>
if(window.XMLHttpRequest) {
xmlhttp = new XMLHttpRequest();
xmlhttp.onreadystatechange = function() {
if(xmlhttp.readyState === 4 && xmlhttp.status === 200) {
alert('send to server successfully');
}
};
xmlhttp.open("POST", "test2.php", true);
xmlhttp.send("Imgname=13");
}
</script>
in test2.php
<?php
$temp = $_POST['Imgname'];
echo $temp; /////output should be 13
?>
but error Undefined index: Imgname in C:\xampp\htdocs\test2.php on line 2

You need to make sure that you're sending the correct content-type:
xmlhttp.setRequestHeader("Content-type", "application/x-www-form-urlencoded");

Try sending the header:
var http = new XMLHttpRequest();
var url = "test2.php";
var params = "Imgname=13";
http.open("POST", url, true);
http.setRequestHeader("Content-type", "application/x-www-form-urlencoded");
http.onreadystatechange = function() {//Call a function when the state changes.
if(http.readyState == 4 && http.status == 200) {
alert(http.responseText);
}
}
http.send(params);

Ajax in timer is affecting my server

I am using ajax so that i can read the content of a file from my server .I am calling a function where ajax is , in a timer.And this is affecting my server .It is crashing.If this is the correct way to do it , what's wrong?
Please give a few sugestions,because i don't know what its problem is.
I am calling first the function:"function(ctrl)".
function get(ctrl){
var content;
content=ctrl.id;
var getTextUpdate= setInterval(function () {
readdocument();
}, 1200);
}
function readdocument() {
var xmlhttp;
if (window.XMLHttpRequest){
xmlhttp=new XMLHttpRequest();
}else{
xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
}
xmlhttp.onreadystatechange=function(){
if (xmlhttp.readyState==4 && xmlhttp.status==200)
{
document.getElementById("area").value=xmlhttp.responseText;
}
}
xmlhttp.open("GET","../user/test/read-text.php?user="+content,true);
xmlhttp.send();
}
Here it is the read-text.php file:
<?php
$rec_user=$_GET['user'];
echo($rec_user);
$chat = fopen($rec_user.".txt", "r") or die("Unable to open file!");
echo fread($chat,filesize($rec_user.".txt"));
fclose($chat);
?>

The problem with your code is that, you are not waiting for the response to get over. So over the time, you are sending request after request. This is going to use up all memory in due time. So first wait for the response before sending the next request.
How about this ?
function loadXMLDoc(ctrl) {
var content=ctrl.id;
var xmlhttp = new XMLHttpRequest();
var url = "../user/test/read-text.php?user="+content;
xmlhttp.onreadystatechange = function () {
if (xmlhttp.readyState == XMLHttpRequest.DONE) {
if (xmlhttp.status == 200) {
document.getElementById("area").value=xmlhttp.responseText;
setTimeout(loadXMLDoc(), 1200); //call the function again
} else if (xmlhttp.status == 400) {
console.log('There was an error 400');
} else {
console.log('something else other than 200 was returned');
}
}
};
xmlhttp.open("GET", url, true);
xmlhttp.send();
};
loadXMLDoc(ctrl);

How to stop IE from caching my XHR

<?php
if(isset($_GET['dt']))
{
echo 'a';
die();
}
?>
<div onclick="call('data_call.php?dt=a')">DATA</div>
<script>
function call(url)
{
var xhr = new XMLHttpRequest();
xhr.open("GET", url, true);
xhr.onload = function (e) {
if (xhr.readyState === 4) {
if (xhr.status === 200) {
alert(xhr.responseText);
} else {
alert("");
}
}
};
xhr.onerror = function (e) {
alert("");
};
xhr.send(null);
}
</script>
If I run the above code in chrome (the latest version) and click the div it alerts a
If, without refreshing my window I edit the php file and change the echo 'a' to echo 'b' then save it and click the div, it alerts b.
The above is the expected behaivor. In the lastest version of internet explorer, for some reason it always alerts a.
Why please?

To prevent caching issues (typically response headers should mitigate this to a certain degree), you're better off busting the cache yourself:
function getUniqueURL(url)
{
return url + (url.indexOf('?') == -1 ? '?' : '&') + '_=' + new Date().getTime();
}
xhr.open("GET", getUniqueURL(url), true);

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);

My data posts to a new page rather than the specified div

Why does my post data appear on a new blank page rather than the div I specified? This script is in the head of a page called order.php. I want the data submitted to be written in the "message" div I created on order.php. But when I submit, I am redirected to update.php where the data is written on a blank page.
<script type="text/javascript">
function insert() {
if (window.XMLHttpRequest) {
xmlhttp = new XLMHttpRequest();
} else {
xmlhttp = new ActiveXObject('Microsoft.XMLHTTP');
}
xmlhttp.onreadystatechange = function() {
if (xmlhttp.readyState == 4 && xmlhttp.status == 200) {
document.getElementById("message").innerHTML = xmlhttp.responseText;
}
}
parameters = 'child_name'+document.getElementById('child_name').value;
xmlhttp.open('POST', 'update.php', true);
xmlhttp.setRequestHeader('Content-type', 'application/x-www-form-urlencoded');
xmlhttp.send(parameters);
}
</script>

you current page is order.php and your posting it to update.php by doing this xmlhttp.open('POST', 'update.php', true);

This might be due to normal form submission event.
use a simple jquery
$("#form").submit(function(){
$.post("update.php",{paramertes:'child_name_'+$("#child_name").val()},function(data){
$("#message").html(data);
})
return false;//don't forget to use this
})