I am making an html script that will use jQuery.post() method in order to use a php script. The post() method needs an url of the php code but my php code is part of the html code
What Url should i use?
<html>
<body>
<button onclick="test()">
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.2/jquery.min.js"></script>
<script>
var test = function() {
$('--I DONT KNOW--',{testvar:"hello"});
}
</script>
<?php
$testvar = $_POST['testvar'];
echo $testvar;
?>
</body>
</html>
An empty URL is a relative URL that resolves as the URL of the current page.
$.post("", {testvar:"hello"});
(Keep in mind that since your PHP does nothing with the data except output it, and your JS does nothing with the response, this will have no visible effect outside of the Network tab of your browser's developer tools).
Related
I'm trying to attach a PHP script to a button so when someone clicks on it, I'm sent what page they're on. I have the PHP script written and I'm trying to attach it to a JavaScript onclick call. Here's what I have so far:
<button id="location">Click to reveal the page you're on</button>
<script>
function send_sms() {
var result = '<?php locate_me(); ?>';
console.log('send_sms');
}
document.getElementById('location').addEventListener('click', send_sms, false);
</script>
However, the JavaScript gets called when the page loads - not when the button is clicked - or maybe it's just the PHP that gets run. The console.log command does not get written on page load, but the PHP script is run. Very strange - at least to me.
I'm not proficient with JavaScript, but I thought the addEventListener() would prevent that from happening. What am I doing wrong?
Thanks,
Frank
I'm not sure about what you mean by "revealing what page the user is on", but I'm thinking that's not relevant to the question, you're asking. I'm not too kean on running php scripts on the same file, I'm running my js on. As nice_dev suggested, I would make an ajax call to a seperate php file, in order to get live updates and not having your php variables pre-loaded.
So I would write my code like this:
Your main file:
<?php // Result from your second php file ?>
<script>
// Ajax call
$(document).ready(function(){
$("#location").click(function(){
var result = '<?php echo $variable; ?>';
$.ajax({
url: "somepage.php",
type: "POST",
data: {result:result},
success: function(result){alert(result }});
});
});
</script>
<html>
<body>
<button id="location">Click to reveal the page you're on</button>
</body>
</html>
Your second file, which will handle your ajax request:
<?php
$yourvariable = $POST['result'];
if isset($yourvariable){
// The php code you want to execute
}
?>
I hope this makes sense. Otherwise, I would be happy to elaborate.
In summary, I would try to run your code on 2 files in a circular process.
My aim is to get an element <div id="calender"> and all what is in the element shown in a browser. The point is that normal get-html-source won't do the thing. The element what I am looking for does not exists in the html output of php-function file_get_contents.
I have tried to get the source by php with xpath byt the help of http://us3.php.net/manual/en/class.domxpath.php which inludes a nice tool to get what is in any tag in the html page. But the problem here might be that the element (a calender) is formed to the loaded page by javascript and cannot be caught by server side php. So, is there a way I can catch such element (div) by javascript instead.
There are script examples of javascript for this kind of problem (if I have understood them correctly) but currently I cannot get a simple javascript to work. An example below shows how I have tried to built up a code. $ajax thing here is just one path I have tried to solve the problem but don't know how to use it. More here I cannot figure out why the simple javascript functions do not work (just test purposes).
<!doctype html>
<html lang="fi">
<head>
<meta charset="utf-8">
<title>load demo</title>
<style>
body {
font-size: 12px;
font-family: Arial;
}
</style>
<script type="text/javascript">
function ok {
alert "OK";
}
function get_html (my_html){
alert "OK";
var l = document.getElementById('my_link').value;
alert l;
alert my_html;
var url = my_html;
$.ajax({
url: url,
dataType: 'html'
success: function(data){
//do something with data, which is the page 1.html
var f = fs.open("testi_kalenteri.html", "w");
f.write(data);
f.close();
alert "data saved";
}
});
}
</script>
</head>
<body>
<p id ='my_link' onclick='get_html("lomarengas.fi/en/cottages/kuusamo-rukasaukko-9192")'>html-link</p>
<p id ='ok' onclick='ok()'>show ok</p>
</body>
</html>
Briefly, I have a link to a web page, which shows up a (booking) calendar in it but this calendar is missing in the "normal" source code, by file_get_contents (php). If I browse the html source with Chromes tools (F12) I can find the calendar there. T want that information get by javascript or by php or such.
If you read the source code of the page you point to (http://www.yllaksenonkalot.fi/booking/varaukset_akas.php), you notice that the calendar is loaded via an iframe.
And that iframe points to that location :
http://www.nettimokki.com/bookingCalendar.php?id_cottage=3629&utm_source=widget&utm_medium=widget&utm_campaign=widget
Which is in fact the real source of the calendar...
EDIT following your comment on this answer
Considering the real link : http://www.lomarengas.fi/en/cottages/kuusamo-rukasaukko-9192
If the calendar is not part of the generated html, it is surely asynchronously generated (in javascript, client side).
From this asumption, I inspected the source code (again).
In the developper tools of my browser, in the Network section, where you can monitor what files are loaded, I looked for
calls to server (everything but calls to resources : images, stylesheets...).
I then noticed calls to several urls with json file extensions like http://www.lomarengas.fi/api-ib/search/availability_data.json?serviceNumber=9192¤tMonthFirstDate=&duration=7.
I felt I was on the right track (asynchronous javscript calls to generate html with json datas), I looked for javascript code or files that was not the usual libraries files (jquery, bootstrap and such).
I stumbled upon that file : http://www.lomarengas.fi/resources_responsive/js/destination.js.
It contains the code that generates asynchronously the calendar.
tl;dr
The calendar is indeed generated asynchronously.
You can't get the full html with a curl or file_get_content in PHP and
you can't access it with ajax code (due to Same-origin policy).
By the way, you should contact the site to see if you can access their api via PHP with their consent.
Hope it helped you understand the whole thing...
To get <div id="calender"> you can use next code (jquery):
<div id="calender"></div>
<script>
$("#calendar").click(function(){
alert('calendar was clicked');
});
</script>
If I understand you correctly. I think you need appropriate php respond with some correct code inside php file:
// json_handler.php
<?php
if (is_ajax()) {
$return = $_POST;
$return["ok"]="ok";
$return["json"] = json_encode($return);
echo json_encode($return);
}
function is_ajax()
{
return isset($_SERVER['HTTP_X_REQUESTED_WITH']) && strtolower($_SERVER['HTTP_X_REQUESTED_WITH']) == 'xmlhttprequest';
}
and this is script wich is inside html:
<html>
<head>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.0/jquery.min.js"></script>
</head>
<body>
<a id="click">click</a>
<script>
$("document").ready(function(){
$("#click").click(function(){
var data = {
"request": "request"
};
data=$.param(data);
// alert(data);
$.ajax({
type: "POST",
dataType: "json",
url: "json_handler.php",
data: data,
success: function(data) {
// here you will see echo respond from your php json_handler.php
// also you can add here more javascript (jquery code) to change your page after respond
alert();
}
});
return false;
});
});
</script>
<body>
<html>
http://www.w3schools.com/jquery/jquery_ajax_intro.asp
Something like the below does not work:
<?php $nojs = false; ?>
<noscript>
<?php $nojs = true; ?>
</noscript>
As the PHP is executed regardless if JS is enabled or not. But is there a way to get a similar effect? I'm trying to set a flag if JS is disabled and then display parts of the page accordingly.
PHP is executed before javascript, so you cannot do this. You can do something such as executing a basic ajax request and storing hasjs in a session variable once the ajax page is successfully queried. You wouldn't know if it's just the fact that the ajax request wasn't successful due to something else, or if they have Javascript disabled.
Lets give this a shot anyway:
The jquery script in your head tags
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.0/jquery.min.js"></script>
<script>
$( document ).ready(function() {
$.get( "hasjs.php", { hasjs: "1"} );
});
</script>
The PHP file (hasjs.php)
<?php
if(isset($_GET['hasjs']))
{
session_start();
$_SESSION['hasjs'] = 1;
}
?>
Then you can access the session variable to determine if they have JS based off the ajax query. Nothing stopping the user from visiting that page though if they don't have JS installed.
i have test.html and test.php file uploaded to /var/www/html in my AWS Amazon EC2
URL of test.html is : http://ec2-11-11-111-11.ap-northeast-1.compute.amazonaws.com/test.html
URL of test.php is: http://ec2-11-11-111-11.ap-northeast-1.compute.amazonaws.com/test.php
test.html is:
<!DOCTYPE html>
<head>
<script type="text/javascript" charset="utf-8">
function myFunction(){
var url = "http://ec2-11-11-111-11.ap-northeast-1.compute.amazonaws.com/test.php";
var data = "test_data_string";
alert("Post to PHP"); //check to see if javascript is working
$.post(url, {testdata:data},
function(echo){alert(echo);});
}
</script>
</head>
<body>
<button onclick="myFunction()">Click me</button>
</body>
</html>
test.php is:
<?php
$data = $_POST['testdata'];
echo "success";
?>
I am expecting to get alert("success"); when I click the "click me" button, but I am getting nothing.
i get alert("Post to PHP"); when I click on the button. so it seems that both of the files are working except $.post();
What am i doing wrong here??
These two urls are not accessible , I am not sure what you are doing but putting the php file online does not mean that it is accessible and will run as a script.
URL1: http://ec2-11-11-111-11.ap-northeast-1.compute.amazonaws.com/test.html
URL2: http://ec2-11-11-111-11.ap-northeast-1.compute.amazonaws.com/test.php
Include jQuery library
update:
Your js does not have problem if you include the jquery library. I tested it sends the post request successfully. jsFiddle
I am trying to load php code into div tag to show the results but the below code doesn't work for.
Can anyone please help me...to resolve this
my code is below:
<html>
<head>
<script src="//code.jquery.com/jquery-1.9.1.js"></script>
<script type="text/javascript">
$("document").ready(function()
{
$("#myDiv").load("refreshing.php");
}
</script>
</head>
<body>
<div id='myDiv'> </div>
</body>
</html>
Change script tag to this
<script type="text/javascript">
$(document).ready(function()
{
$("#myDiv").load("refreshing.php");
});
</script>
i.e. you're missing ); at the end
Also, document should not have quotes on it
You cannot load php code .load() because as the web server gets the GET request with .php, the request is passed to PHP interpreter which will execute the PHP script and return the result of the php script instead of code. So what you can do is in your PHP script, do a echo of all the code that you want to display. Or, you can define custom rule in your Apache configuration.
You've forgotten the closing bracket:
$("document").ready(function(){
$("#myDiv").load("refreshing.php");
});