Load JavaScript when condition is true - php

How do I load a script if a PHP condition is true?
For example, I got an external script called script.js and I wanna load this if it's on the product page of WooCommerce.
I've tried the following but it doesn't work because it prints the code on the page:
<?php
add_action( 'template_redirect', 'check_product_page' );
function check_product_page() {
if(is_product()) {
include ('script.js');
}
}
?>
If I write the script inside a PHP like the below, it causes a fatal error:
<?php
echo
'<script type="text/JavaScript">
window.addEventListener("load", function() {
//some code here...
})
</script>';
?>

Try this:
<?php
if($condition == true){
echo '<script type="text/javascript" src="script.js"></script>';
}
?>
or:
<?php if($condition == true): ?>
<script type="text/javascript" src="script.js"></script>
<?php endif; ?>

Actually this works on my side, checkout maybe you have another issue:
echo '<script type="text/JavaScript">
window.addEventListener("load", function() {
//some code here...
})
</script>';

It's because the single quotes are inside your string. You should actually do it the way which other people have shown, but if you need it to be an inline script you can do it like this:
<?php
//some php can go here..
?>
<script type="text/JavaScript">
window.addEventListener("load", function() {
//some code here...
})
</script>
<?php //more php can go here... ?>

Related

How to auto-scroll down when my page loads In Wordpress?

I write the below code to a footer.php file. This works but is applied for all the pages. I want to apply page scroll in one page only.
<script type="text/javascript">
jQuery(document).ready(function() {
jQuery('body').animate({scrollTop: +400}, 1000);
});
</script>
Can any one help me on how to do it.
Thanks
Add a contidional statemnent on the footer.php file to only execute the jquery code if it is in only in the current page you wish for.
something like this example below
<?php
global $post;
$target_pageid = 7654;
$current_pageid = $post->ID;
if (current_pageid == $target_pageid){
?>
jQuery(document).ready(function() {
jQuery('body').animate({scrollTop: +400}, 1000);
});
<?php
}
?>

jquery and strings from php code

I have a problem how to pass for example $example=1; variable to this jquery like a value in bracket where is 20, 40, 60.....:
<script type="text/javascript">
$(document).ready(function() {
$("#pb1").progressBar(20);
$("#pb2").progressBar(40);
$("#pb3").progressBar(60);
$("#pb4").progressBar(70);
$("#pb5").progressBar(100);
$("#pb6").progressBar(100);
});
</script>
The main problem is that I want to example string have value from database, so that's why I need to make it outside of script.
If this code is in your .php page...
<script type="text/javascript">
$(document).ready(function() {
$("#pb1").progressBar(<?php echo $pb1 ;?>);
$("#pb2").progressBar(<?php echo $pb2 ;?>);
$("#pb3").progressBar(<?php echo $pb3 ;?>);
$("#pb4").progressBar(<?php echo $pb4 ;?>);
$("#pb5").progressBar(<?php echo $pb5 ;?>);
$("#pb6").progressBar(<?php echo $pb6 ;?>);
});
</script>
Where $pb1,$pb2,$pb3,$pb4,$pb5,$pb6 are Integers ..
This is simple:
<?php
//Insert your code to generate the values to $example
$example = ...
?>
// and here is your JS with php code inside it
<script type="text/javascript">
$(document).ready(function() {
$("#pb1").progressBar(<?php echo $example; ?>);
$("#pb2").progressBar(<?php echo $example1; ?>);
$("#pb3").progressBar(<?php echo $example2; ?>);
$("#pb4").progressBar(<?php echo $example3; ?>);
$("#pb5").progressBar(<?php echo $example4; ?>);
$("#pb6").progressBar(<?php echo $example5; ?>);
});
</script>
I hope it helps! Good Luck!
If you meant to pass php variable to client to dynamically replace numbers in jquery you can use like code in below
<script type="text/javascript">
$(document).ready(function() {
$("#pb1").progressBar(<?php echo example; ?>);
});
</script>
First off, having it in your database does not mean you cannot do so in the script. There are in fact several ways to do that. You could have your javascript file be php that generates javascript instead of html, or perhaps easier: you could use inline javscript. However, if you do want to keep the two separated it is still possible:
[..]
<script type='text/javascript'>var percentageDone = <?php echo intval($example) ?>;</script>
<script type="text/javascript">
$(document).ready(function() {
$("#pb1").progressBar(percentageDone);
});
</script>
[..]

calling javascript function from php

I am trying to call a javascript function from php. According to all of the examples I have been looking at the following should work but it doesn't. Why not?
<?php
echo "function test";
echo '<script type="text/javascript"> run(); </script>';
?>
<html>
<script type="text/javascript">
function run(){
alert("hello world");
}
</script>
</html>
Your html is invalid. You're missing some tags.
And you need to call the function after it has been declared, like this
<html>
<head>
<title></title>
<script type="text/javascript">
function run(){
alert("hello world");
}
<?php
echo "run();";
?>
</script>
</head>
<body>
</body>
</html>
In this case you can place the run before the method declaration, but as soon as you wrap the method call inside another script tag, the script tag has to be after the method declaration.
Try yourself http://jsfiddle.net/qdwXv/
the function must declare before use
it should be
<html>
<script type="text/javascript">
function run(){
alert("hello world");
}
<?php
echo "function test";
echo run(); ;
?>
</script>
</html>
As others have suggested, the function needs to be declared first. But, if you need to echo out the JavaScript from PHP first, you can either store it in a PHP variable to echo out later, or have your code wait for the dom to finish loading first...
document.ready = function() {
run()
}
If you're using jQuery or another framework, they probalby have a better way of doing that... In jQuery:
$(function(){
run();
})

how to shorten code involving php and jquery

This code is very simple so I feel like it could be shortened by relating the php variable to the jquery function parameter. if you have any ideas, please help. thank you
<script type="text/javascript">
<?php if (is_page($toppageID1)) { ?>
$(document).ready(function () {
Show('1');
});
<?php } elseif (is_page($toppageID2)) { ?>
$(document).ready(function () {
Show('2');
});
<?php } elseif (is_page($toppageID3)) { ?>
$(document).ready(function () {
Show('3');
});
<?php } elseif (is_page($toppageID4)) { ?>
$(document).ready(function () {
Show('4');
});
<?php } elseif (is_page($toppageID5)) { ?>
$(document).ready(function () {
Show('5');
});
<?php } elseif (is_page($toppageID6)) { ?>
$(document).ready(function () {
Show('6');
});
<?php } elseif (is_page($toppageID7)) { ?>
$(document).ready(function () {
Show('7');
});
<?php }; ?>
</script>
Have something like $somevalue that would help to switch instead of elseif.
<script>
<?php switch($somevalue){ ?>
$(document).ready(
function (){
<?php case 1: //?>
<?php case 2: //?>
<?php case 3: //?>
<?php case 4: //?>
<?php case 5: //?>
}
)
<?php } ?>
</script>
First off I would change that function of yours is_page to page and return a string with the ID. You already have access to those $toppageID variables in PHP so why not use them in the function itself. If you absolutely cannot for scoping or other reasons, pass them all in the function at once. You want a single output not executing the function numerous times.
Example script using the re-factored function page:
<body>
...
<!-- end of body -->
<script type="text/javascript">
(function(id) {
if(id) {
Show(id);
}
else {
// throw some error or something
}
})(<?php echo page() ?>);
</script>
</body>
If you need to funnel all the variables at once maybe something like this:
})(<?php echo page($toppageID1,$toppageID2,$toppageID3,...) ?>);
SOrry if I was unclear but im using wordpress functions. a switch works great.
<?php $currID = get_the_ID(); ?>
$(document).ready(function () {
});

if isset SESSION display div

How do i do in jquery, to check if there's anything in isset SESSION user_message, each 1 seconds, and if there is then display #box else dont..
thanks
PHP file (session.php):
<?php if( isset($_SESSION) ){echo 1;}?>
JS file:
function checkSession(){
$.ajax({url: "session.php", success: function(data){
if( data == 1){
$('#box').show();
}else{
$('#box').hide();
}
}});
}
setInterval('checkSession()',1000);
This is untested, but it should do what you're looking for. Note that, typically, AJAX request expect XML or JSON, so you can reformat the session.php file the way you want.
Use PHP to echo the jQuery command:
if (isset($_SESSION['user_message'])) {
echo '<script> $("#box").… </script>';
}
This will only echo the following if $_SESSION['user_message'] is set:
<script> $("#box").… </script>
Simple as this:
<?php
if (isset($_SESSION['user_message']))
{
?>
<script>
$('#box').show(2000);
</script>
<?php
}
?>
Or you can use fadeIn or fadeOut with specified time.
<?php if (isset($_SESSION['user_message'])) { ?>
<script type="text/javasscript">
$("#box").show(1000);
</script>
<?php } ?>

Categories