Jquery is not working in php block - javascript

<body>
<ul id="M8" class="Mh"><li ><a id="atagid" class="msub" href="javascript:;
"onclick="trackchange();" >Track Change(OFF)</a></li></ul>
<?php
if(isset($_SESSION['track'])){
echo "<script>alert('working');</script>";
echo "<script>
$(document).ready(function(){
$('#atagid').css('color','green');
$('#atagid').html('Track Change(ON)');
});</script>";
}
?>
<script>
function trackchange(){
$('#atagid').css('color','green');$('#atagid').html('Track Change(ON)');}
//This function is working but in php block it is not working
</script>
</body>
If $_SESSION['track'] is set then the html element a color should be changed to green and the content should be changed to Track change(ON).
In this script alert function is working which confirms the session variable, but content and color of a tag is not getting changed. I couldn't to find where am I doing wrong.

The probable issue with your code is misplacement of jQuery file, Just try to put it in the <head>...</head>.

You need to include jQuery first by using
<script src="point/to/your/jquery.min.js"></script>

Related

Is it possible to change HTML within PHP code?

What is the easiest way to run Javascript code inside PHP, preferably without using external libraries? Specifically, I need the innerHTML of a div to change depending on some calculations performed using the user's form inputs that were captured earlier with $_POST in a separate form. How can I get the following JS code to run inside the following PHP code? (My most basic attempt was using echo command, but it's throwing up errors)
HTML:
<div id="output">
</div><!--#output -->
PHP (desired JS included):
if (count($valid_locations)<$num_of_locations){
echo '<script>const output = document.querySelector("#output");</script>;';
echo '<script>output.innerHTML = "<div class="alert-danger"> Trip unable to be created. Please adjust the budget/number of travelers/duration etc.</div>;";</script>';
}else{
createTrip($trips);
}
Right now, the IF condition is True and the code does run, but it echos ";" for some reason. I have verified that the condition is met and it runs by adding in a simple echo "this runs";, which did appear upon refresh. I just don't understand why it's outputting to the default echo space and the script isnt running to change the innerHTML of the output div. Is this even possible to do with PHP? If so, what's the best way? (doesn't need to be secure, won't be used publicly). I've heard of a few things such as ajax but it seems so complicated. Any explanations on stuff like that specific to this scenario would be greatly appreciated.
Following up on the comments, you don't need JS to achieve what you want. You could just use PHP
<?php
$output = null;
if (!empty($_POST)) {
//...
//... do stuff
//...
if (count($valid_locations)<$num_of_locations){
$output = 'Error occured - bla bla bla';
}
}
?>
<!DOCTYPE html>
<html>
<head>
</head>
<body>
<?php if (isset($output)) {?>
<div id="output"><?= $output; ?></div>
<?php } ?>
</body>
</html>

onclick attribute can't find Javascript function

I can't manage to link my Javascript function to my 'onclick' html attribute in the span tag.
I keep getting the error:
"Uncaught ReferenceError: closeAndRefresh is not defined" "at
HTMLSpanElement.onclick"
My code looks like this:
<div class="error">
<div id="errorMessage">
<span onclick="closeAndRefresh();">✖</span>
<p id="message">
<?php echo $confirmationMessage ?>
</p>
</div>
</div>
<script>
function closeAndRefresh() {
<?php $visibility = 'hidden' ?>
window.location.reload(true);
}
</script>
I'll also add a screenshot of my code:
Your script is after your HTML. Include it before html so that your function is defined
function closeAndRefresh(){
window.location.reload(true);
}
<span onclick="closeAndRefresh();">✖</span>
Try writing the script function closeAndRefresh() in the head tag of your html page.
Maybe the html page is not able to load the script when you write it inside the body.
If you have recently added the function to your javascript code, consider clearing the browser's cache, in order to force it reload the javascript code. To check if this is the problem, on your browser show the source html code, find the line where the javascript code is included, and click on it; it will show you the javascript source code the browser is currently using, that may be out of date. Also, as mentioned by others, make sure you include the javascript code before you reference it.
Make sure you reference the function correctly and also try putting the script above or below as it seems to be function not recognized.

How do I show my script value from javascript to php

I have a script (javascript)
<script>
$(function(){
$(".editagunan").click(function(){
var id_agunan = $(this).attr("data_id_agunan");
$("#value_id_agunan").val(id_agunan);
$("#myModalEdit").modal("show");
});
});
</script>
how to display 'value_id_agunan' from javascript to php
<?php echo id="value_id_agunan" ?>
but the script is wrong, how to fix ? Thanks
Assuming, you are asking on how to write html inside a php file.
Just write HTML directly, like this:
<p id="value_id_agunan"></p>
If you want to show the above html code on some condition then use php like this:
<?php if(showParagraph){ /* some variable */ ?>
<p id="value_id_agunan"></p>
<?php } ?>

Insert code with JS just like echo in php

I want to get some code snippets from a PHP server to be "injected" in HTML. Basically when I open page.php I get some text like "_off".
The injection works with this code, however I can't use php in this html since it is local.
<img src="images/test
<?php
{ echo "_off"; }
?>
.jpg">
JavaScript seems to be the logical step. But if I just enter this at the position where I want the text of course it doesn't work:
<script type="text/javascript"> $.get( "page.php", function( data ) { document.write(data); } ); </script>
Any ideas?
You need to use $('#someElement').html(data) or $('#someElement').text(data) if you want to write the data to a specific place on the page. You should avoid using document.write
Here is a fiddle to demonstrate: https://jsfiddle.net/yd9mx4d3/

JS Not firing on click

I am trying to load the function call_ajax_add_to_quotelist via the button with the following code:
$cartlink .= '<a class="add_to_cart button alt" href="javascript:void(0);" onclick="call_ajax_add_to_quotelist(add_to_quotelist_ajax_url,'.$product->id.');" '.$style.'>'.$label.'</a>';
The code above is loading fine on the view source however when clicked it is showing dead with no console error I have loaded the js file in the function (It belongs to another plugin I am hacking a WP plugin with the same actions of another plugin)
Script Load:
$quotePluginJSUrl = site_url().'/wp-content/plugins/dvin-wcql/js/dvin_wcql.js';
?>
<script src="<?php echo $quotePluginJSUrl; ?>"></script>
<?php
I would a t first check, if call_ajax_add_to_quotelist is really a function in JavaScript Console, and if add_to_quotelist_ajax_url is a correct value.
Also, it is recommended to not use onclick. I recommend using jQuery event binder .on().
Expl.:
<?php
$cartlink .= "<a class='add_to_cart button' data-id='{$product->id}'
href='javascript:;' {$style}>{$label}</a>";
// ... more products
?>
// **one** <script> after all products
<script>
jQuery(window).on('click', '.add_to_cart.button', function() {
call_ajax_add_to_quotelist(add_to_quotelist_ajax_url, $(this).data('id');
}
</script>
Close the anchor
<a>...</a>
because you are adding the anchor dynamically, you need to use .addEventListener if you're using JS or Event Delegation if you're using jQuery
e.g.
$('.button').on('click',function(){
call_ajax_add_to_quotelist(add_to_quotelist_ajax_url,'.$product->id.');
});
Plus you haven't closed the anchor tag in your code which might cause you some problems:
$cartlink .= '<a class="add_to_cart button alt" href="javascript:void(0);" '.$style.'>'.$label.'</a>'

Categories

Resources