There's plenty of ways to do this in php, but I'm not a serverside, so is there a way to do this in pure JS?
Pure JS? Yes, but only on the server (the specifics would depend on which SSJS implementation you use, Express + NodeJS is popular at present).
You can't receive a POST request on the client. The client makes the request. The server makes the response. That is how HTTP works.
<script>
function showHint(str) {
if (str.length == 0) {
document.getElementById("txtHint").innerHTML = "";
return;
} else {
var xmlhttp = new XMLHttpRequest();
xmlhttp.onreadystatechange = function() {
if (xmlhttp.readyState == 4 && xmlhttp.status == 200) {
document.getElementById("txtHint").innerHTML = xmlhttp.responseText;
}
};
xmlhttp.open("GET", "gethint.php?q=" + str, true);
xmlhttp.send();
}
}
</script>
See more
Related
How do I send these XMLHttpRequests one at a time? Right now they are all firing immediately and if there are over six it locks up the server.
for (var i = 0; i <= document.getElementsByName("combobox")[0].value; i++) {
(function (i) {
var xhr = new XMLHttpRequest();
xhr.open("GET", "/grabdatafromeanotherpage.aspx", true);
xhr.send();
xhr.onreadystatechange = function () {
if (xhr.readyState == 4) {
document.getElementById("txtHint").innerHTML = document.getElementById("txtHint").innerHTML + xhr.responseText;
}
}
})(0);
}
Just some untested ideas that may make Javascript gurus scream in agony, but hey, they haven't answered:
You could probably get it to work with (deprecated) synchronous calls, doing something like this:
for (var i = 0; i <= document.getElementsByName("combobox")[0].value; i++) {
var xhr = new XMLHttpRequest();
xhr.open("GET", "/grabdatafromeanotherpage.aspx", false);
xhr.send(); // This will block until a request has been received, no need for a callback function
if (xhr.status == 200) {
document.getElementById("txtHint").innerHTML = document.getElementById("txtHint").innerHTML + xhr.responseText;
}
}
If you don't want to use synchronous calls, and you are sure the problem is on the server side (ie. the server can't handle this many almost-simultaneous requests) you could call request number i+1 from the callback of request i, but it would be very messy code.
You could also use the setTimeout() function to send the requests at intervals the server can handle, 500ms in this example:
for (var i = 0; i <= document.getElementsByName("combobox")[0].value; i++) {
setTimeout(myXHR, 500 * i)
}
function myXHR() {
var xhr = new XMLHttpRequest();
xhr.open("GET", "/grabdatafromeanotherpage.aspx", true);
xhr.onreadystatechange = function () {
if (xhr.status == 200 && xhr.readyState == 4) {
document.getElementById("txtHint").innerHTML = document.getElementById("txtHint").innerHTML + xhr.responseText;
}
};
xhr.send();
}
but the order of arrival of the responses would not be guaranteed.
There are probably better/hipper/more modern ways of doing all this with fetch/await.
If you have full control over the server, I would first try to persuade it somehow to accept and process the quick, successive requests; I find it a bit odd the server can't handle this.
I want to call a server side php script in spme special case. in normal method, we do:
var xmlHttp = new XMLHttpRequest();
xmlHttp.onreadystatechange = function() {
if (xmlHttp.readyState == 4 && xmlHttp.status == 200)
//some action
}
xmlHttp.open("GET", theUrl, true); // true for asynchronous
xmlHttp.send(null);
But herejs may be listening for readystatechange. However, in my case, the php script does not return anything. I just need to call it from js and forget it. How can that be done so that js does not wait for any response and continue other things after passing the request?
There's two ways you can do this.
If you don't care at all about if the request was successful or not, just remove the onreadystatechange-listener:
var xmlHttp = new XMLHttpRequest();
xmlHttp.open("GET", theUrl, true); // true for asynchronous
xmlHttp.send(null);
If you don't care about the response, but you want to show an error if the http-request failed:
var xmlHttp = new XMLHttpRequest();
xmlHttp.onreadystatechange = function() {
if (xmlHttp.readyState == 4 && xmlHttp.status != 200) {
// This block will now get executed when the request is done
// and the HTTP status is anything but 200 OK (successful)
}
}
xmlHttp.open("GET", theUrl, true); // true for asynchronous
xmlHttp.send(null);
I'm trying to send XMLHttpRequest from client side js to my node server. But nothing is happening. I'm quite new to this stuff. This is my function in javascript.
function sendTokenToServer(token) {
var xhttp = new XMLHttpRequest();
xhttp.onreadystatechange = function() {
if (xhttp.readyState == 4 && xhttp.status == 200) {
// document.getElementById("demo").innerHTML = xhttp.responseText;
console.log(xhttp.responseText);
}
xhttp.open("GET","http://localhost:3000/", true);
xtthp.send();
};
}
And this is my route in node js
app.get('/fcm', function(req, res) {
console.log('here');
res.end('hee');
});
You aren't making a request to the endpoint you created, you are requesting the route: / (which may or may not exist). Change the request to
xhttp.open("GET","http://localhost:3000/fcm", true);
And it should work (assuming your webpage and the server are running on the same port, otherwise you could run into CORS issues).
I'm making and app and I need do get the number of verses of a chapter of the bible.
I'm getting the info from http://www.kingjamesbibleonline.org/
In order to do that I am making an XMLHttpRequest to send to the server from the function getVerses() from the site.
The problem that I am facing is that I'm not getting a .responseText from the XMLHttpRequest. When I use firebug and call that function, in the Network tab > Response tab I get nothing but on Network tab > Preview I get the answer.
Where is this answer coming from and what is the variable that has this value?
My node code is as follows:
let XMLHttpRequest2 = require("xmlhttprequest").XMLHttpRequest;
function getVerses() {
let xmlhttp = new XMLHttpRequest2(); //: new ActiveXObject("Microsoft.XMLHTTP");
xmlhttp.onreadystatechange = function() {
if (xmlhttp.readyState == xmlhttp.DONE ) {
if(xmlhttp.status == 200){
console.log(xmlhttp.responseText);
}
else if(xmlhttp.status == 400) { }
else { }
}
}
xmlhttp.open("POST", "http://www.kingjamesbibleonline.org/ajax.php", true);
xmlhttp.setRequestHeader("Content-type","application/x-www-form-urlencoded");
xmlhttp.send('callFunc=getMaxVerseForChapter&book='+'"Genesis"'+'&chapter='+'"2"');
}
getVerses();
Apparently the server is very strict and it expects the header to be called Content-Type and not Content-type. Some kind of poorly written stuff obviously (in PHP). Also get rid of the double quotes around the values you are sending.
Here you go:
let XMLHttpRequest2 = require("xmlhttprequest").XMLHttpRequest;
function getVerses() {
let xmlhttp = new XMLHttpRequest2(); //: new ActiveXObject("Microsoft.XMLHTTP");
xmlhttp.onreadystatechange = function() {
if (xmlhttp.readyState == xmlhttp.DONE ) {
if(xmlhttp.status == 200){
console.log(xmlhttp.responseText);
}
else if(xmlhttp.status == 400) { }
else { }
}
}
xmlhttp.open("POST", "http://www.kingjamesbibleonline.org/ajax.php", true);
xmlhttp.setRequestHeader("Content-Type","application/x-www-form-urlencoded");
xmlhttp.send('callFunc=getMaxVerseForChapter&book=' + 'Genesis' + '&chapter=' + '2');
}
getVerses();
and since you are hardcoding the values, you don't really need string concatenation:
xmlhttp.send('callFunc=getMaxVerseForChapter&book=Genesis&chapter=2);
good afternoon. I'm developing an app that can get a JSON from local (manifest.json). I want to get this file from JavaScript and then read it. But I have a problem, I cant call this file. How can I?
var urlJSON = new XMLHttpRequest("manifes.json").toString;
var dataJSON = JSON.parse(urlJSON);
alert(dataJSON.name);
var xmlhttp = new XMLHttpRequest();
var url = 'manifest.json';
xmlhttp.onreadystatechange = function() {
if (xmlhttp.readyState == 4 && xmlhttp.status == 200) {
console.log(JSON.parse(xmlhttp.responseText));
}
if (xmlhttp.status == 404) {}
};
xmlhttp.open('GET', url, true);
xmlhttp.send();
Or run chrome with arguments --allow-file-access-from-files
Or download and create server for your app