I'm trying to echo information on a page after and anchor has been clicked
<a id="anchor">Information</a>
<?php
if(?){
echo 'INFORMATION';
}
?>
<a id="anchor" onclick="document.getElementById('information').style.display='block';">Information</a>
<div id="information" style="display:none"><? echo 'INFORMATION' ?></div>
I think you must use javascript here. PHP would need a page refresh to process your echo statement.
That's where you might want to utilize AJAX. You can often approach it like this:
<a onClick=" $('#output').load('output.php') ">click here</a>
<div id="output"><!-- This is where the content goes --></div>
Then define the according PHP script output.php like this:
<?php
echo $whatever;
?>
jQuery will then issue another HTTP request, invoking a PHP script, and finally injects it where you told it to (#output div).
Since PHP (your httpd, exactly) doesn't know anything about anchors, you'll need to handle this with javascript. Try jQuery.
You cant do this in PHP I'm afraid. PHP lives on the server and the page is on your client (browser). In order to do something (other than go to another page) when some clicks, you'll need to use javascript. Look at jquery.
You can't do it like this.
PHP works in the server side, therefore once the anchor information has come to the client browser, you won't be able execute any PHP code there.
There are several workarounds if you really want to achieve that.
i) Use client side JavaScript.
ii) Use Ajax to maker requests to server side and update page accordingly.
If you really want to show the information after clicking into a link can use the following code:
<html>
<title>lasdfjkad</title>
<head>
<script type="text/javascript">
function showhide(id){
if (document.getElementById){
obj = document.getElementById(id);
if (obj.style.display == "none"){
obj.style.display = "";
} else {
obj.style.display = "none";
}
}
}
</script>
</head>
<body>
Show/Hide Details
<div id="abc" style="display:none;">
your codes......
</div>
</body>
</html>
The real beauty of Javascript.....Hope this help you
Related
I have a Wordpress based website, and some of the content is loaded through javascript.
For example:
jQuery(".portfolio-fs-slides").css({"display":"none"}).prepend('<div class="portfolio-fs- slide current-slide portfolio-ppreview"><div class="project-coverslide"></div><div id="content" class="content-projectc contenttextwhite"></div></div>');
What I want to do is append this shortcode: <?php echo do_shortcode('[daisy]'); ?>
But as far as I know is not really possible to append php code in javascript.
Is there any workaround to accomplish this ?
Thanks!
As #Bergi mentioned, the PHP will run serverside, and the JS will run client side. You can output JS (or parts of your JS) via PHP and have it run client side, e.g.
<script>
// extra code here
jQuery(".portfolio-fs-slides").css({"display":"none"}).prepend('<div class="portfolio-fs- slide current-slide portfolio-ppreview"><div class="project-coverslide"></div><div id="content" class="content-projectc contenttextwhite"></div></div>');
<?php echo 'we can output valid js here' ?>
// more code here
</script>
One way to think of this is that since PHP runs server side, it will always run before the JS is parsed.
Put another way, you could have a javascript line like this:
console.log(<?php echo $someVariable ?>);
Hi i am not a php developer, ive never touched it before. but i have been asked to add a google shopping cart tracking code to a website. when someone completes an order then get sent to finishorder.php. when i go the finishorder.php file it looks like this:
include(dirname(__FILE__)."/init.php");
$GLOBALS['ISC_CLASS_ORDER'] = GetClass('ISC_ORDER');
$GLOBALS['ISC_CLASS_ORDER']->HandlePage();
which just looks like server script to me (coming from a .net background), so i presume i cannot add the javascript here, how does php decide get the layout for this page? how can i add the javascript code to this page.
You can do this:
include(dirname(__FILE__)."/init.php");
$GLOBALS['ISC_CLASS_ORDER'] = GetClass('ISC_ORDER');
$GLOBALS['ISC_CLASS_ORDER']->HandlePage();
echo '<script type="text/javascript">YOUR JS HERE</script>';
OR
<?php
include(dirname(__FILE__)."/init.php");
$GLOBALS['ISC_CLASS_ORDER'] = GetClass('ISC_ORDER');
$GLOBALS['ISC_CLASS_ORDER']->HandlePage();
?>
<script type="text/javascript">YOUR JS HERE</script>
Hmm?
But I think that HandlePage() method will do something with our page so I'd look inside this method Class ISC_ORDER->handlePage() what it does... You can then echo Your within this method on appropriate place...
EDIT:
<?php
echo '<script type="text/javascript">//<!--
alert("Hello to multiline JS script");
alert("Do You get it?");
//--></script>';
?>
You can add javascript inside a php code as
<?php echo "<script> alert('this is a javascript code')</script>"; ?>
You can add script in PHP page by 2 ways
The first way is to add it in PHP tags
<?php
//PHP CODE
if($_POST['submit']){
echo '<script>alert('Hello')</script>';
}
?>
The second way is to add it after PHP code
<?php
//PHP CODE
?>
<script>
alert('Hello');
</script>
I have the following code:
<?php
if ($x == 1){
?>
<b>Some html...</b>
<?php
}
else if ($x==2){ ?>
<b> Other html...</b>
<?php
}
?>
Now I would like to have two links below (a href) and somehow pass the variable $x (so Link1 passes x=1 and Link2 passes x=2) in order to load the relevant bit of code from if statement. I know I can pass $x using the form and then test its value and load required a bit of code, but I would like to do it smoothly, without reloading the page. I think that jQuery could help it, but I have no idea how to do it. Any ideas greatly appreciated.
Forgetting about PHP for the moment, you're looking for jQuery's .load():
<div id="container"></div>
Load 1
Load 2
<script type="text/javascript">
loadContent = function(content){
$('#container').load(content + '.html');
}
</script>
The above code (not tested, but it's at least close) will insert the contents of 1.html, or 2.html (on the server) into the div with id="container".
There are plenty of tutorials, like the one linked in pygorex1' answer, that cover various ways of doing this.
What you're looking for is AJAX - the ability to load server content using background HTTP requests in Javascript. Here's a tutorial I've found useful for implementing AJAX using JQuery:
http://articles.sitepoint.com/article/ajax-jquery
I wish to do something iframe-like with my div i've got going here.
Basically, i've gotten as far as making links change the content of the div like so:
Open file
This works pretty well, sadly though, if i make another link inside that to change the content back to the first file, the server gets stuck in an infinite loop and crashes.
I really am just trying to find some way to dynamically change content, and to fetch that content from a file using php. If my way of approaching this is completely ludicrious, i do appreciate suggestions.
I think the best and easiest way is to use jQuery:
<script type="text/javascript">
$('#addContent').click(function(){
$("#maincontent").load("file.php");
return false;
});
</script>
Open File
<div id="maincontent"></div>
This script will load content of file.php into selected div using ajax call.
This looks like a good place for jQuery's load() function. Just give the div an id, add a click event to the link and have the event load the contents of your php script into the div. Maybe append a class (e.g., 'updated') to the div when you load the new data. That way your click event can check is('.uploaded') on the div and switch it back when the link is clicked again.
Put divs inside #maincontent that hold the different content that you want. Give the divs IDs. When the link is clicked hide/show the appropriate content
This is a similar thread: Tabbing in PHP?
Firstly, I'd suggest not building the event handler like that. For one thing you'll have to be really careful you correctly escape the content. I would do it this way:
<div id="content1">
<?php include 'file1.php'; ?>
</div>
<div id="content2">
<?php include 'file2.php'; ?>
</div>
and then manipulate those with Javascript. You could either set the innerHTML or simply hide/show the relevant divs. So:
<script type="text/javascript">
var content = 1;
function swap_content() {
document.getElementById('maincontent').innerHTML = document.getElementById('content' + content).innerHTML
if (content == 1) {
content = 2;
} else {
content = 1;
}
}
</script>
Open File
Alternatively you could just hide/show them as appropriate rather than copying content.
Lastly, while not required this is much more trivial to do in a Javascript library like jQuery.
To me it sounds like you should use AJAX. On the clickevent (which you also shouldn't bind with inline code), you would instead load the content with an XHR request.
To make life easier for you I would recommend looking at a JavaScript Library, where my personal favorite would be jQuery (www.jquery.com). To achieve what you are trying to do you would just do:
$('#id_to_the_a_tag').click(function() {
$("#maincontent").load("file.php");
return: false;
});
I have the following jQuery code in my PHP file (edited Jan 19 2010 # 10:40 MST):
<?php
$count = 0;
foreach($attachments as $attachment) :
echo '<script type="text/javascript">
$(\'#a_'.$count.'\').click(function() {
$(\'#d_'.$count.'\').show(200);
});
// if "no" is clicked
$(\'#d_'.$count.' .no\').click(function() {
$(\'#d_'.$count.'\').hide(200);
});
// if "yes" is clicked
$(\'#d_'.$count.' .yes\').click(function() {
$(\'#d_'.$count.'\').hide(200);
// update database table -- this is why I need the script inside the for loop!
var jsonURL = \'http://path/to/update_db_script.php\';
$.getJSON(jsonURL, {\'post_id\' : '.$attachment->ID.'}, function(data) {
alert(\'Thank you. Your approval was received.\');
});
$(\'#a_'.$count.'\').replaceWith(\'<span>Approved</span>\');
});
</script>';
echo '<li>';
if($attachment->post_excerpt == 'approved') {
// Check the proof's status to see if it reads "approved"
echo '<span>Approved</span>';
} else { ?>
// If not yet approved, show options
<a class="approve" id="a_<?php echo $count; ?>" href="#">Click to Approve</a>
<div class="confirm-approval" id="d_<?php echo $count; ?>">
<p>Please confirm that you would like to approve this proof:</p>
<a class="yes" href="#">Yes, I approve</a>
<a class="no" href="#">No, not yet</a>
</div><?php
} ?>
</li>
<?php $count++;
endforeach; ?>
The page in question is available here. The "click to approve" links do not work (that's my problem).
When I view source, the PHP variables appear to have echoed properly inside the jQuery:
<script type="text/javascript">
$('#a_0').click(function() {
$('#d_0').show(200);
});
... etc ...
</script>
This looks correct, but nothing happens when I click any of the links. However, when I replace the PHP echo statements with plain numbers (0, 1, etc.) the click functions work as expected.
You may be asking: why on earth do you have this inside a for loop? The reason is that I need to retrieve the attachment->ID variable and pass it to an external PHP script. When someone clicks "approve" and confirms, the external script takes the attachment->ID and updates a database value to read "approved".
Why won't the click function fire when PHP is in place? Is there some kind of greater force at work here (e.g., hosting limitation), or am I missing a fundamental piece of how PHP and JavaScript interact?
Since you didn't post your HTML its a little hard to troubleshoot.
First, I am not sure why one is working and the other is not since the code it is outputting looks correct. Either way, I still would make some changes. Move your a_0,a_1, etc and d_0,d_1, etc into the id attribute instead of a class:
<div>Click Me</div>
<div class="confirm_approval" id="d_0">Show Me</div>
<div>Click Me</div>
<div class="confirm_approval" id="d_1">Show Me</div>
Now, instead of outputting your code in a loop in PHP, place this jQuery code once on your page:
$(document).ready(function(){
$("a.approve[id^='a_']").click(function(e){
var id = this.id.replace('a_',''); // Get the id for this link
$('#d_' + id + '.confirm-approval').show(200);
e.preventDefault();
});
});
This code finds any a element with the approve class that has an id that starts with a_. When this is clicked, it grabs the number off the id a_0 = 0 and uses that id to find the confirm-approval element and show it.
Since the javascript is run on the client and has no way of knowing whether the script was generated using PHP or not, I think that particular part is a wild goose chase...
When I replace the PHP echo statements
with plain numbers (0, 1, etc.) the
click function works as expected.
Do this again and compare the actual output using view-source in a browser. I'll bet you find that there is a difference between the working and failing scripts, other than one of them being generated by PHP.
It seems that the problem is in jQuery selectors. Instead of dynamically binding click() events on multiple objects with an output of PHP code, use just one class selector and bind to objects with this class. And you can specify an id attribute to make them unique.
Something strange too is to have the script tag and the
$(document).ready(function()
in the loop. I don't know if this causes any problems, but it's sure not very efficient, one time is enough.