index.php
<html>
<head>
<script language="JavaScript" src="lol.js.php"></script>
</head>
<?php
//grab product id's who need to be showed
$pids = '1,2,3';
?>
<body onload="update_timers();">
lol.js.php
<script type="text/javascript">
function update_timers()
{
alert('hi');
}
</script>
I'm not sure what I'm missing, but this isn't poping up the alert window. Why is that?
Remove
<script type="text/javascript">
</script>
from the JS file.
The JavaScript error console in your browser should show these tags as syntax errors.
Also, as #Jared points out, you should send a content type header:
<?php header("Content-type: text/javascript"); ?>
Related
I am getting the issue
Warning: Use of undefined constant otherInput - assumed 'otherInput'
(this will throw an Error in a future version of PHP) Warning: A
non-numeric value encountered
I know there is some issue with the quote.
What I am doing is, I have to click on the anchor tag called Click me one and sending the data-id in the script. I am getting the id value in the script but I am getting the error on $(".showme'+otherInput+'").show();
I am using WordPress and I have to use the below code in the function.php so I have to use my script inside the PHP tag.
This is the screenshot of the code
Here is the code
<!DOCTYPE html>
<html>
<head>
<title></title>
<style type="text/css">
.showme{display: none;}
</style>
</head>
<body>
<div class="clickme" data-id="1">Click me one</div>
<div class="showme showme1">this is example</div>
<?php
echo '<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script>
<script type="text/javascript">
$(".clickme").click(function(){
var otherInput=$(this).data("id");
$(".showme'+otherInput+'").show();
});.
</script>';
?>
</body>
</html>
It looks like everything in your php block is all JQuery/Javascript.
Q: What do you even need the PHP block and the "echo" for?
Current:
<?php
echo '<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script>
<script type="text/javascript">
$(".clickme").click(function(){
var otherInput=$(this).data("id");
$(".showme'+otherInput+'").show();
});.
</script>';
?>
Suggested change:
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script>
<script type="text/javascript">
$(".clickme").click(function(){
var otherInput=$(this).data("id");
$(".showme"+otherInput).show();
});.
</script>'
Just follow the regular js standard, and if you willing to implement your script inside the php code:
Replace your code with these changes:
<!DOCTYPE html>
<html>
<head>
<title></title>
<style type="text/css">
.showme{display: none;}
</style>
</head>
<body>
<div class="clickme" data-id="1">Click me one</div>
<div class="showme showme1">this is example</div>
<?php
echo '<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script>
<script type="text/javascript">
$(".clickme").click(function(){
var otherInput=$(this).data("id");
$(".showme"+otherInput).show();
//here otherInput js variable is just used as regular js variable inside the script, so no need to extra commas to call that js variable, just use it like you do in js files, and will work fine.
});
</script>';
?>
</body>
</html>
Hiii everyone,
I just want to show one div if the database value is equal to some value.I tried like this
<?php echo $show['birth_certificate_available']=='Available') { ?>
<script type="text/javascript">
$(".birth").show();
</script>
<?php } ?>
But the div is not showing.I dont know why its not working.Kindly guide me to correct this issue.
Please modify the code accordingly :
<?php if($show['birth_certificate_available']=='Available') { // put a condition?>
<script type="text/javascript">
$(document).ready(function(){ // jQuery ready function
$(".birth").show();
});
</script>
<?php } ?>
Wrap it in ready() function as follows,
Assuming you have already imported the relevant jquery lib in your code.
<?php echo $show['birth_certificate_available']=='Available') { ?>
<script type="text/javascript">
$(document).ready(function(){
$(".birth").show();
});
</script>
<?php } ?>
I missed JQuery reference document so that its not worked.Now I added script document its working.Thanks all who helped me to fix this.
Solution
echo outputs data to the page. To write a condition, you would like to use if statements.
<?php if ($show['birth_certificate_available'] === 'Available'): ?>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script>
<script>
$(document).ready(function() {
$('.birth').show();
});
</script>
<?php endif; ?>
Note: if jQuery is already linked to your document, remove the <script src="..."></script> line. Otherwise, I suggest you to move the <script src="..."></script> line right before the </body> HTML closing tag to speedup HTML elements loading:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8" />
<title></title>
</head>
<body>
<div class="birth" hidden="hidden">Foobar</div>
<?php if ($show['birth_certificate_available'] === 'Available'): ?>
<script>
$(document).ready(function() {
$('.birth').show();
});
</script>
<?php endif; ?>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script>
</body>
</html>
Note: I use the === equal assertion to force type testing. Whatever, be careful: testing is case-sensitive, whether it is == or ===
The div element must have the birth class, must exist and must be hidden in order to successfully show() it
Debug
$show variable
If this is not working, and in order to debug the $show variable, you may want to use var_dump() as so:
var_dump($show);
and ensure it is an array and has the birth_certificate_available index defined.
Javascript errors
Use the browser console to retrieve javascript errors (such as inexisting div elements...)
Probably I'm misunderstanding something about Fancybox v1 but have the following minor issue. First I'm calling fancybox via clicking a link:
$(document).ready(function() {
$(".href").click(function() {
$.fancybox.open({
href : $(this).attr("data-id"),
type : 'iframe'
});
});
});
This loads a simple PHP/HTML page with JS, to be populated into the Fancybox window:
<!DOCTYPE html><html><head><title></title></head>
<body>
<?php
# this is the fancybox content
echo "<script>var dcwrtext = 'random_text'; document.write(dcwrtext);</script> Some other content to show on fancybox.";
?>
</body></html>
The content appears without a problem, but the nuance is, the document.write value is echoed after the closing </script> tag: and this makes the content visible on the page, not the document.write() function. You can see this in the source code:
<body>
<script>var dcwrtext = 'random_text'; document.write(dcwrtext);</script>**random_text** Some other content to show on fancybox.
</body>
The problem seems to be with fancybox, if I use the document.write() on a standard HTML (not fancyboxed) page, as expected, it will correctly show 'random_text' on the page, inside <script></script> only. This is the source code:
<body>
<script>var dcwrtext = 'random_text'; document.write(dcwrtext);</script> Some other content to show on fancybox.
</body>
What I'd need is if I open the fancbox window, 'random_text' shouldn't appear literally after the closing </script> tag, but would be displayed only by the document.write() function.
This is how I tested:
main page:
<html>
<head>
<title></title>
<meta name="" content="">
<link rel="stylesheet" type="text/css" href="fancybox/source/jquery.fancybox.css?v=2.1.2" media="screen" />
</head>
<body>
<div data-id="fancy.php" class="href">open fancy</div>
<script src="http://code.jquery.com/jquery-1.9.0.js"></script>
<script src="http://code.jquery.com/jquery-migrate-1.2.1.js"></script>
<script type="text/javascript" src="fancybox/source/jquery.fancybox.js?v=2.1.3"></script>
<script>
$(document).ready(function() {
$(".fancybox").fancybox();
$(".href").click(function() {
$.fancybox.open({
href : $(this).attr("data-id"),
type : 'iframe'
});
});
});
</script>
<div id="theid" class="fancybox"></div>
</body>
</html>
and the page being opened in fancybox: fancy.php
<html>
<head>
<title></title>
</head>
<body>
<?php
$randomtext = "random_text";
echo "<script>var dcwrtext = '$randomtext'; document.write(dcwrtext);</script>Some other content to show on fancybox";
?>
</body>
</html>
[I had to include jquery-migrate-1.2.1.js because of an error [ Uncaught TypeError: Cannot read property 'msie' of undefined] when including newer versions of jquery with fancybox]
I am new in jquery. I was trying to use Jcombo plugin but that one wasn't working for me. Here what I did :
<!doctype html>
<head>
<script type="text/javascript" src="http://code.jquery.com/jquery-latest.js"></script>
<script type="text/javascript" src="http://www.prodiven.com/jcombo/jquery.jCombo.min.js"></script>
<script type="text/javascript">
$(function() {
/* simple combos */
$("#state1").jCombo("getStates.php");
});
</script>
</head>
<body>
<select id="state1"></select>
</body>
</html>
getStates.php file output was like this:
{"1":"Bangladesh","2":"Arabic"}
Any idea why I can't see drop down selection. Thanks
I got the solution .. It was problem with the plugin. I just noticed that in jCombo.min.js script dataType was "jsonp" I changed it to :
dataType:"json"
now it's working...
I have index.html like this
<!DOCTYPE html>
<html lang="en">
<head>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/
libs/jquery/1.3.0/jquery.min.js"></script>
<script type="text/javascript">
$(document).ready(function(){
var auto_refresh = setInterval(
function ()
{
//alert("abc");
$('#mydiv').load('xyz.php').fadeIn("slow");
}, 1000);
});
</script>
</head>
<body>
<div id="mydiv"> </div>
</body>
</html>
In same folder there is xyz.php file whose code is this:
<?php
echo "My first PHP script!";
?>
When I uncomment //alert("abc"); and comment $('#mydiv').load('xyz.php').fadeIn("slow");
alert message comes every second but vice versa is not working when I am calling php file and commenting alert message. Why?
It´s working for me, but you only can see the content one time, because .load function is replacing the old content, change
$('#mydiv').load('xyz.php').fadeIn("slow");
with this
$('#mydiv').append($('<div >').load('xyz.php'));
I renamed index.html to index.php and called that by localhost/firstproject/index.php. That worked