XMLHttpRequest() returning 0 - javascript

I have the following javascript which runs when an image is clicked:
function dateBack () {
var httpRequest = new XMLHttpRequest();
httpRequest.onreadystatechange = function() {
if (this.readyState == 4 && this.status == 200) {
document.getElementById("hell").innerHTML = httpRequest.responseText;
}
else {
document.getElementById("hell").innerHTML = httpRequest.readyState;
document.getElementById("hell").innerHTML = httpRequest.status;
}
};
httpRequest.open('POST', 'subtractDay.php?depDate=sal', true)
}
and the subtractDay.php which looks like this:
<?php
$depDate = $_REQUEST["depDate"];
echo $depDate;
?>
The code has been edited slightly from my original code for simplicity sake.
When I click the image, the element with id "hell" gets the value of 0 which means that the request was not initialized.
The file subtractDate.php can be accessed from the same server as the file with the javascript code. Please advise.

it missing .send()
httpRequest.open('POST', 'subtractDay.php?depDate=sal', true)
httpRequest.send(null);

Related

how to use embed code in javascript variable

I have this variable in js :
var video_embed = '<script src="https://stream.laminor.academy/1qwyvs9ystd9/embed"><\/script>';
$('.my_video').after("<div class='col-xs-12' id='video_content'>"
+ video_embed +
"</div>");
but my rendered HTML code is :
<div class="col-xs-12" id="video_content">
<script src="https://stream.laminor.academy/1qwyvs9ystd9/embed"></script>
</div>
embed code not working!
Thanks for help
when you generate script tags after the document is loaded, it won't run.
You need to download the script and execute it :
//Code that will download the script
function loadScript() {
var xhttp = new XMLHttpRequest();
xhttp.onreadystatechange = function() {
// Making sure there's no error
if (this.readyState == 4 && this.status == 200) {
// Executing the script
eval(this.responseText)
} else if (this.readyState == 4) {
// If the server responded with something else than a 200 OK
console.warn(this.status)
}
};
xhttp.open("GET", "https://stream.laminor.academy/1qwyvs9ystd9/embed", true);
xhttp.send();
}
// Executing the function
loadScript()
Let me know if it isn't working.

POST value from JavaScript to PHP via AJAX without jQuery

I'm trying to send a JavaScript variable to be processed server-side by PHP then echo back the result. My ajax request results in readyState == 4 and status == 200 yet PHP keeps echoing back an empty array/value.
I'm pretty sure this comes from my Ajax call sending an empty request but everything I tried didn't work, so maybe I'm going all wrong here.
JS (from index.html) :
var valueToSend = Math.random();
var request = false;
if (window.XMLHttpRequest) {
request = new XMLHttpRequest();
}
else if (window.ActiveXObject) {
request = new ActiveXObject('Microsoft.XMLHTTP');
}
function send_ajax() {
if (request) {
request.open('POST', 'test.php', true);
request.onreadystatechange = function() {
if (request.readyState == 4 && request.status == 200) {
console.log(request.responseText);
}
}
request.send(valueToSend); //this line is probably not sending the value the way I expect it to
}
}
PHP (from test.php) :
echo $_POST['name']; //simple echo to check if PHP indeed receives valueToSend
My last try was to change request.send(valueToSend); with .send(encodeURI('name=' + valueToSend)); but it just made the ajax call redirect the page location to a non-existing one.
What am I doing wrong ?
There are few things wrong in your code, such as:
Even through you defined send_ajax() function, you didn't call it anywhere in the code.
With POST request you need to send an HTTP header setRequestHeader() along with the request, like this:
request.setRequestHeader("Content-type", "application/x-www-form-urlencoded");
echo $_POST['name']; in test.php page won't work because name is undefined here. Your send() method call should be like this:
request.send("name="+valueToSend);
So the complete JavaScript code would be like this:
var valueToSend = Math.random();
var request = false;
if (window.XMLHttpRequest) {
request = new XMLHttpRequest();
}
else if (window.ActiveXObject) {
request = new ActiveXObject('Microsoft.XMLHTTP');
}
function send_ajax() {
if (request) {
request.open('POST', 'test.php', true);
request.onreadystatechange = function() {
if (request.readyState == 4 && request.status == 200) {
console.log(request.responseText);
}
}
request.setRequestHeader("Content-type", "application/x-www-form-urlencoded");
request.send("name="+valueToSend);
}
}
send_ajax();

Get Smarty-formatted data from PHP script

My PHP script, that I call via XMLHttpRequest, executes a query and checks a condition, then outputs a HTML snippet with some Smarty code. When I try to insert that code in a <div> tag, either by calling the jQuery.html() function or by setting the innerHTML property, the Smarty code is printed as it is, thus not interpreted as Smarty code. How could I solve this problem?
Relevant code:
PHP Script:
<?php
$mysqli = new mysqli("localhost", "<<<SQL USERNAME>>>", "<<<SQL PASSWORD>>>", "<<<SQL DATABASE>>>");
$id = $_GET["idmf"];
$cat = $mysqli->query("<<<SQL QUERY>>>")->fetch_assoc()["category"];
if ($cat == $_GET["cat"])
echo 'blahblah';
?>
TPL file:
{foreach from=$manufacturers item=manufacturer name=manufacturers}
<div id="mffilter_{$manufacturer.id_manufacturer}"></div>
<script>
var xhttpf;
if (window.XMLHttpRequest)
{
xhttpf = new XMLHttpRequest();
}
else
{
// code for IE6, IE5
xhttpf = new ActiveXObject("Microsoft.XMLHTTP");
}
xhttpf.onreadystatechange = function()
{
if (this.readyState == 4 && this.status == 200)
{
document.getElementById("mffilter_{$manufacturer.id_manufacturer}").innerHTML = this.responseText;
}
};
xhttpf.open("GET", "<<<ENDPOINT>>>.php?cat=food&idmf={$manufacturer.id_manufacturer}", true);
xhttpf.send();
</script>
Try replacing your TPL file code with the following code:
{foreach from=$manufacturers item=manufacturer name=manufacturers}
<div id="mffilter_"{$manufacturer.id_manufacturer}></div>
<script>
var xhttpf;
if (window.XMLHttpRequest)
{
xhttpf = new XMLHttpRequest();
}
else
{
// code for IE6, IE5
xhttpf = new ActiveXObject("Microsoft.XMLHTTP");
}
xhttpf.onreadystatechange = function()
{
if (this.readyState == 4 && this.status == 200)
{
document.getElementById("mffilter_"{$manufacturer.id_manufacturer}).innerHTML = this.responseText;
}
};
xhttpf.open("GET", "<<<ENDPOINT>>>.php?cat=food&idmf="{$manufacturer.id_manufacturer}, true);
xhttpf.send();
</script>

How to check if a session is empty using javascript inside php

Also, how do i unset the session through javascript?
I have made this code with PHP:
if(isset($_SESSION) && !empty($_SESSION)) {
unset($_SESSION['Plan1']);
unset($_SESSION['excel_array']);
$_POST['excel_name']['Main'] = "Main".date("y_m_d_Hi");
$_POST['excel_array']['Main']['Plan1'] = array();
}
else{
$_SESSION['excel_name']['Main'] = "Main".date("y_m_d_Hi");
$_SESSION['excel_array']['Main']['Plan1'] = array();
}
So here i check if there is a session. If there is, i unset it and send the $_POST data instead. however, if there isn't one, i create it.
The problem is, i might want to call this on a button click. How would i make a code with the same functionality, but using a javascript function?
Put your php in a file on its own, called set_session.php for example:
<?php
session_start();
unset($_SESSION['Plan1']);
echo 'unset';
?>
Call it in javascript:
<script>
function unset() {
var xhttp = new XMLHttpRequest();
xhttp.onreadystatechange = function() {
if (this.readyState == 4 && this.status == 200) {
document.getElementById("result").innerHTML = this.responseText;
}
};
xhttp.open("GET", "set_session.php", true);
xhttp.send();
}
</script>
<button type="button" onclick="unset()">Unset</button>
<div id="result"></div>

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

Categories