Javascript variable in PHP - php

Using the HTML5 Geolocation API I've ended up with some variables in Javascript that I need to pass to PHP in order to continue. My code is below, how could it be achieved? I've tried things along the lines of $variable = <script>document.write(variable);</script>;
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset=utf-8 />
<meta name="viewport" content="width=620" />
<title>test</title>
</head>
<body>
<script type="text/javascript">
//Check if browser supports W3C Geolocation API
if (navigator.geolocation) {
navigator.geolocation.getCurrentPosition(successFunction, errorFunction);
}
else {
document.write("Geolocation is required for this page.");
}
function successFunction(position) {
var lat = position.coords.latitude;
var lng = position.coords.longitude;
}
function errorFunction(position) {
document.write("Error");
}
</script>
<?php
error_reporting(E_ALL);
ini_set('display_errors', '1');
$lat = //TAKE FROM JAVASCRIPT
$lng = //TAKE FROM JAVASCRIPT
$url = "http://api.geonames.org/findNearbyPlaceNameJSON?lat='.$lat.'&lng='.$lng.'&username=demo";
$json = file_get_contents($url);
$data = json_decode($json, true);
$geonames = $data['geonames'][0];
$town = $geonames['name'];
echo "Displaying results near ".$town.". <a href=#>Not in ".$town."?</a>";
?>
</body>
</html>
EDIT: OK, I've done some homework and now I know I'm looking at an AJAX XMLHttpRequest to slick over the two. However, its syntax has slightly thrown me (not to mention the cross-browser issues). Can anyone give me a nudge in the right direction with this one?

Considering Javascript is interpreted by the client only after the server interprets the PHP, this is impossible.
Your only way to pass the Javascript data to PHP and then show the PHP results would be to send the data retrieved by the Javascript to the PHP via AJAX/XHR and then use Javascript to display the response from the PHP script.

To pass javascript variables to PHP you will have no choice but to request a new page, since PHP stops executing when a page is sent to the browser.
You can pass to it either via GET, POST or COOKIE. GET is the easiest way: http://domain.com/page?town=XYZ. All you need to do afterwards is store your town in a PHP session and redirect to the desired page using header('Location: http://domain.com/page')
Using an Ajax request will allow you to do that without resorting to sessions and page reloads.

You are mixing Server-side scripting along with browser-side scripting
$variable dissapears on the browser-side and so it will always hold "document.write(variable);" whatever the script inside there is written in.
You can however use AJAX to send the data back to php & process it there.

Related

How can I prevent a page from loading if there is no javascript, but using php instead of <noscript>?

I have a page with php and other stuff in the code. What I need to do is a way to check with php if there is javascript enabled in the browser.
This way, the whole page source will be prevented to be loaded, instead of using that only prevents the page from loading, but allows the source code.
PHP is a server-side language. There is no way to do this with PHP since it is run on the server, and then the result is sent to the client. The server has no knowledge of whether the client has JavaScript enabled or not.
If you don't want to show the code in your .html file when JS is disabled, then you don't have to use PHP. You could put the essential stuff in the .html file and load the rest in with JavaScript. If JavaScript is disabled, the rest of the stuff never gets loaded in the first place. (This is called progressive enhancement.)
This example will use the <noscript></noscript> tag inside an echo directive.
<?php
echo "<noscript>You need JS enabled to view the text on this page.</noscript>";
?>
<!DOCTYPE html>
<html>
<head>
</head>
<body>
<script>
document.write("<h1>Heading Text</h1>");
document.write("<p>This message appeared because you have JS enabled.</p>");
</script>
</body>
</html>
You could make JavaScript fire a request to a page, setting a session variable enabling access to the website, then reload the page. This is by no means secure.
In all files except enable.php (could be done via an include/etc) before anything is echoed.
...
if (!isset($_SESSION['enabled']) { ?>
<!doctype html>
<html>
<head>
...
<script>
var xhr = new XMLHttpRequest();
xhr.open('GET', '/enable.php', false);
xhr.send();
window.location.reload();
</script>
</head>
<body></body>
</html>
<?php die();
}
....
In enable.php, you would then do
$_SESSION['enabled'] = 1;
enable.php would only need to be hit once-per-session and if JavaScript was disabled afterwards, or it was hit manually by pointing the browser there, your server will not know the difference. The assumption is the client must have JavaScript enabled for this session if the page was reached this session.

How do I use Ajax to auto refresh a div across domains?

Can someone help me out? I have an html file that calls a php script via ajax and displays a random number that the php script generates. It works just fine when both files are on the same domain, but if the 2 files are located at different domains, which is what I need, nothing happens. Can someone help me fix this.
The code for the HTML file is:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js"></script>
<script type="text/javascript">// <![CDATA[
$(document).ready(function() {
$.ajaxSetup({ cache: false }); // This part addresses an IE bug. without it, IE will only load the first number and will never refresh
setInterval(function() {
$('#divToRefresh').load('http://www.OTHERDOMAIN.com/random.php');
}, 5000); // the "5000" here refers to the time to refresh the div. it is in milliseconds.
});
// ]]></script>
</head>
<body>
<div id="divToRefresh">Loading users...</div>
</body>
</html>
If the line
$('#divToRefresh').load('http://www.OTHERDOMAIN.com/random.php');
is changed to:
$('#divToRefresh').load('random.php');
and placed in the same folder as the html file all is well.
The code for the php file is:
<?php
$random1 = sprintf("%02f", rand(0,9212));
echo $random1;
?>
What would the revised code that would allow cross domain ajax calls look like? I was reading documentation that talked about a json request wrapper, but I did not get where it was going. Any help would be hugely appreciated.
you are not able to use ajax cross domain its not possible, you have the following options though:
1.do the ajax to your own page and make a curl call to that page..
2.do $.getJSON('ur', variables, function(data){}).
there are few other solution, but those 2 are basically your best options
here is how getJson works:
On your server you should have a page that is ready to receive the $_GET sort of like an API or normal ajax call would do with $_POST.
should look something like :
<?php
if(!empty($_GET['jsoncallback']) && !empty($_GET['variable'])){
/* do whatever you like with the variable you get as get
*
*
*
**/
// echo the name of the callback function + the variables you want to receive back in JS
echo $_GET['jsoncallback'].'('.json_encode($jason_echo).')';
}
?>
Your JS or page you are going to do the call from should look something like:
$.getJSON("SomePage/PagethatTakesTheGet.php?jsoncallback=?", {variable:15}, function(response){
// do whatever you want with response.
});

Need to pass a variable to OnLoad() from a PHP header() redirect

I have a PHP variable thePHPvar in a file DoStuff.php in my website.
thePHPvar gets set to a string.
Then after that the code in DoStuff.php does
header("Location: http://localhost/theWebite/index.php");
I need 2 things in my onLoad handler inside the body tag of index.php:
<body onload="doLoad()">
My doLoad() function must be able to do 2 things:
1) get access to 'thePHPvar' variable, which again is a string (a path name) that was set in PHP code in DoStuff.php just prior to the header() redirect.
2) also, doLoad() must be able to detect when 'thePHPvar' is empty so it can avoid trying to use
'thePHPvar' and skip the logic that uses that string.
I'm new to php and javascript and have impressed myself with getting working what I have now,
but I've spent 1/2 day on this, read lots of similar issues on SO.
I have to be able to redirect back to index.php, grab this string variable and if it's been set (not null), execute some javascript code.
Right now this is all my onLoad() does, and hey -- it works. But not the right way, yet.
<head>
<script type="text/javascript">
function doLoad()
{
alert("Page is loaded");
}
</script>
</head>
Without introducing a bunch of new stuff I'd have to learn like Ajax etc., how can I get this done in javascript, html, php and what I have here?
You can use a session variable as Jorge said, if this myPHPVar is specific to a user. Otherwise, pass the variable in your header redirect:
header("Location: http://localhost/theWebite/index.php?myVar=" . $myPHPVar);
As you're a beginner, you probably won't want to use JSON to get the variable from PHP to Javascript, but do look it up if you ever have to pass a lot of data to Javascript code.
<script>
var myPHPVar="<?php echo $_GET['myVar']; ?>";
</script>
If the user has any influence over that PHP variable, be sure to sanitise the variable against XSS attacks.
To check if myPHPVar is empty in your doLoad method, just use if (!myPHPVar) { .... }
Would it be acceptable to include $thePHPvar in the querystring of the page you're redirecting to?
header("Location: http://localhost/theWebite/index.php?$thePHPvar");
and then in javascript you can just look for document.location.search, eg
<head>
<script type="text/javascript">
function doLoad()
{
alert('thePHPvar is ' + document.location.search.substring(1));
}
</script>
</head>
I suggest you set a session with the variable you want and then use the session to fetch the variable on the next page.
After initializing the session on the page you redirected to, you'd use it on the javascript like this:
var variableFromPhp = "<?php echo $the_variable ;?>";
alert(variableFromPhp);
You could pass it as a GET param, but that's generally less secure since it's tamperable.
Previous page:
Then on the page you redirect to:
<head>
<?php
session_start();
$the_var=(isset($_SESSION['a_var']) && $_SESSION['a_var'])) ?
$_SESSION['a_var']
: false;
?>
<script type="text/javascript">
function doLoad(the_var)
{
if(the_var){ alert("Page is loaded"); }
}
window.onload=function(){ doLoad(<?php echo var_export($the_var,true);?>); }
</script>
</head>

Access a JavaScript variable from PHP

I need to access a JavaScript variable with PHP. Here's a stripped-down version of the code I'm currently trying, which isn't working:
<script type="text/javascript" charset="utf-8">
var test = "tester";
</script>
<?php
echo $_GET['test'];
?>
I'm a completely new to both JavaScript and PHP, so I would really appreciate any advice.
UPDATE: OK, I guess I simplified that too much. What I'm trying to do is create a form that will update a Twitter status when submitted. I've got the form working OK, but I want to also add geolocation data. Since I'm using Javascript (specifically, the Google Geolocation API) to get the location, how do I access that information with PHP when I'm submitting the form?
The short answer is you can't.
I don't know any PHP syntax, but what I can tell you is that PHP is executed on the server and JavaScript is executed on the client (on the browser).
You're doing a $_GET, which is used to retrieve form values:
The built-in $_GET function is used to collect values in a form with method="get".
In other words, if on your page you had:
<form method="get" action="blah.php">
<input name="test"></input>
</form>
Your $_GET call would retrieve the value in that input field.
So how to retrieve a value from JavaScript?
Well, you could stick the javascript value in a hidden form field...
<script type="text/javascript" charset="utf-8">
var test = "tester";
// find the 'test' input element and set its value to the above variable
document.getElementByID("test").value = test;
</script>
... elsewhere on your page ...
<form method="get" action="blah.php">
<input id="test" name="test" visibility="hidden"></input>
<input type="submit" value="Click me!"></input>
</form>
Then, when the user clicks your submit button, he/she will be issuing a "GET" request to blah.php, sending along the value in 'test'.
As JavaScript is a client-side language and PHP is a server-side language you would need to physically push the variable to the PHP script, by either including the variable on the page load of the PHP script (script.php?var=test), which really has nothing to do with JavaScript, or by passing the variable to the PHP via an AJAX/AHAH call each time the variable is changed.
If you did want to go down the second path, you'd be looking at XMLHttpRequest, or my preference, jQuerys Ajax calls: http://docs.jquery.com/Ajax
_GET accesses query string variables, test is not a querystring variable (PHP does not process the JS in any way). You need to rethink. You could make a php variable $test, and do something like:
<?php
$test = "tester";
?>
<script type="text/javascript" charset="utf-8">
var test = "<?php echo $test?>";
</script>
<?php
echo $test;
?>
Of course, I don't know why you want this, so I'm not sure the best solution.
EDIT: As others have noted, if the JavaScript variable is really generated on the client, you will need AJAX or a form to send it to the server.
If showing data to the user, do a redirect:
<script language="JavaScript">
var tester = "foobar";
document.location="http://www.host.org/myphp.php?test=" + tester;
</script>
or an iframe:
<script language="JavaScript">
var tester = "foobar";
document.write("<iframe src=\"http://www.host.org/myphp.php?test=" + tester + "\"></iframe>");
</script>
If you don't need user output, create an iframe with width=0 and height=0.
try adding this to your js function:
var outputvar = document.getElementById("your_div_id_inside_html_form");
outputvar.innerHTML='<input id=id_to_send_to_php value='+your_js_var+'>';
Later in html:
<div id="id_you_choosed_for_outputvar"></div>
this div will contain the js var to be passed through a form to another js function or to php, remember to place it inside your html form!.
This solution is working fine for me.
In your specific geolocation case you can try adding the following to function showPosition(position):
var outputlon = document.getElementById("lon1");
outputlon.innerHTML = '<input id=lon value='+lon+'>';
var outputlat = document.getElementById("lat1");
outputlat.innerHTML = '<input id=lat value='+lat+'>';
later add these div to your html form:
<div id=lat1></div>
<div id=lon1></div>
In these div you'll get latitude and longitude as input values for your php form, you would better hide them using css (show only the marker on a map if used) in order to avoid users to change them before to submit, and set your database to accept float values with lenght 10,7.
Hope this will help.
Well the problem with the GET is that the user is able to change the value by himself if he has some knowledges. I wrote this so that PHP is able to retrive the timezone from Javascript:
// -- index.php
<?php
if (!isset($_COOKIE['timezone'])) {
?>
<html>
<script language="javascript">
var d = new Date();
var timezoneOffset = d.getTimezoneOffset() / 60;
// the cookie expired in 3 hours
d.setTime(d.getTime()+(3*60*60*1000));
var expires = "; expires="+d.toGMTString();
document.cookie = "timezone=" + timezoneOffset + expires + "; path=/";
document.location.href="index.php"
</script>
</html>
<?php
} else {
?>
<html>
<head>
<body>
<?php
if(isset($_COOKIE['timezone'])){
dump_var($_COOKIE['timezone']);
}
}
?>
JS ist browser-based, PHP is server-based. You have to generate some browser-based request/signal to get the data from the JS into the PHP. Take a look into Ajax.
I'm looking at this and thinking, if you can only get variables into php in a form, why not just make a form and put a hidden input in the thing so it doesn't show on screen, and then put the value from your javascript into the hidden input and POST that into the php? It would sure be a lot less hassle than some of this other stuff right?
<script type="text/javascript">
function gotzpl(){
var query = window.location.search.substring(1);
if(query){
}else{
var timez = Intl.DateTimeFormat().resolvedOptions().timeZone;
if(timez != 'undefined'){
window.location = "https://sks.com/searches.php?tzi="+timez;
}
}
}
</script>
<?php
// now retrieve value from URL and use it in PHP;
// This way you can get script value in PHP
$istzg = $_GET['tzi'];
?>
<body onload="gotzpl()">

How to pass data from Javascript to PHP and vice versa? [duplicate]

This question already has answers here:
How do I pass JavaScript variables to PHP?
(16 answers)
Closed 2 years ago.
How do I pass have a Javascript script request a PHP page and pass data to it? How do I then have the PHP script pass data back to the Javascript script?
client.js:
data = {tohex: 4919, sum: [1, 3, 5]};
// how would this script pass data to server.php and access the response?
server.php:
$tohex = ... ; // How would this be set to data.tohex?
$sum = ...; // How would this be set to data.sum?
// How would this be sent to client.js?
array(base_convert($tohex, 16), array_sum($sum))
Passing data from PHP is easy, you can generate JavaScript with it. The other way is a bit harder - you have to invoke the PHP script by a Javascript request.
An example (using traditional event registration model for simplicity):
<!-- headers etc. omitted -->
<script>
function callPHP(params) {
var httpc = new XMLHttpRequest(); // simplified for clarity
var url = "get_data.php";
httpc.open("POST", url, true); // sending as POST
httpc.onreadystatechange = function() { //Call a function when the state changes.
if(httpc.readyState == 4 && httpc.status == 200) { // complete and no errors
alert(httpc.responseText); // some processing here, or whatever you want to do with the response
}
};
httpc.send(params);
}
</script>
call PHP script
<!-- rest of document omitted -->
Whatever get_data.php produces, that will appear in httpc.responseText. Error handling, event registration and cross-browser XMLHttpRequest compatibility are left as simple exercises to the reader ;)
See also Mozilla's documentation for further examples
I run into a similar issue the other day. Say, I want to pass data from client side to server and write the data into a log file. Here is my solution:
My simple client side code:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js" type="text/javascript"></script>
<title>Test Page</title>
<script>
function passVal(){
var data = {
fn: "filename",
str: "this_is_a_dummy_test_string"
};
$.post("test.php", data);
}
passVal();
</script>
</head>
<body>
</body>
</html>
And php code on server side:
<?php
$fn = $_POST['fn'];
$str = $_POST['str'];
$file = fopen("/opt/lampp/htdocs/passVal/".$fn.".record","w");
echo fwrite($file,$str);
fclose($file);
?>
Hope this works for you and future readers!
I'd use JSON as the format and Ajax (really XMLHttpRequest) as the client->server mechanism.
Using cookies is a easy way. You can use jquery and a pluging as jquery.cookie or create your own.
Using Jquery + jquery.cookie, by example
<script>
var php_value = '<?php echo $php_variable; ?>';
var infobar_active = $.cookie('php_value');
var infobar_alert = any_process(infobar_active);
//set a cookie to readit via php
$.cookie('infobar_alerta', infobar_alerta );
</script>
<?php
var js_value = code to read a cookie
?>
I've found this usefull Server-Side and Hybrid Frameworks:
http://www.phplivex.com/
http://www.ashleyit.com/rs/
I've been using Ashley's RSJS Script to update values in HTML without any problem for a long time until I met JQuery (ajax, load, etc.)
There's a few ways, the most prominent being getting form data, or getting the query string. Here's one method using JavaScript. When you click on a link it will call the _vals('mytarget', 'theval') which will submit the form data. When your page posts back you can check if this form data has been set and then retrieve it from the form values.
<script language="javascript" type="text/javascript">
function _vals(target, value){
form1.all("target").value=target;
form1.all("value").value=value;
form1.submit();
}
</script>
Alternatively you can get it via the query string. PHP has your _GET and _SET global functions to achieve this making it much easier.
I'm sure there's probably more methods which are better, but these are just a few that spring to mind.
EDIT: Building on this from what others have said using the above method you would have an anchor tag like
<a onclick="_vals('name', 'val')" href="#">My Link</a>
And then in your PHP you can get form data using
$val = $_POST['value'];
So when you click on the link which uses JavaScript it will post form data and when the page posts back from this click you can then retrieve it from the PHP.
You can pass data from PHP to javascript but the only way to get data from javascript to PHP is via AJAX.
The reason for that is you can build a valid javascript through PHP but to get data to PHP you will need to get PHP running again, and since PHP only runs to process the output, you will need a page reload or an asynchronous query.
the other way to exchange data from php to javascript or vice versa is by using cookies, you can save cookies in php and read by your javascript, for this you don't have to use forms or ajax

Categories