Javascript in functions.php

Question

I cant seem to get the following code to work;

function add_js_functions(){
$gpls_woo_rfq_cart = 
gpls_woo_rfq_get_item(gpls_woo_rfq_cart_tran_key() . '_' . 'gpls_woo_rfq_cart');
if(is_array($gpls_woo_rfq_cart)){
$count = count($gpls_woo_rfq_cart); 
}else{
$count = 0;
}
?>
<script type="text/javascript">
var getQuoteIcon = document.getElementsByClassName("icon-account");
if(1 != 0) {
 getQuoteIcon[0].style.display = "none";
 }
</script>
<?php }
add_action('init','add_js_functions');

The php above the script stores a variable from the quote form on the number of items in the form.

I tried the javascript by itself and its seemed to work but its not working in the functions file.

At the moment im using (1 != 0) to make sure its true and to hide the item so I know the JS works, what will happen afterwards is this will become;

if (<?php $count != 0 ?>) {
//rest of the JS here
} 

So that when the page loads, if the form is empty of items then this icon will be hidden (it starts off as inline-block and i dont know how to change this).

• disinfor: You might be loading the script before the element is actually available. Test by doing console.log( getQuoteIcon) right after you assign that varialbe. Also, you can try changing init to wp_footer.
• Nick Jones: This worked disinfor, if you post this as an answer i can mark it correct.
• disinfor: Posted as an answer! Glad it worked for you.

Answer 1

I think you want your php to be <?php echo $count != 0 ?>.

Your PHP is executed server-side, and Javascript client side, the two don't communicate by passing variables between the two. In order to get your PHP variable into your Javascript, you need to echo it.

• disinfor: OP posted that will be future code. The testing scenario of if ( 1 != 0 ) is not working - even though it should be. $count doesn't need to be echoed in this case, since it's a check to see if the JS will even get loaded.
• Nick Jones: I did forget to write echo in my original post, that was the intention though.

Answer 2

It looks like you are loading the JS too soon and the element you are targeting isn't available yet.

Use add_action('wp_footer') to load the JS in the footer.

function add_js_functions(){
$gpls_woo_rfq_cart = 
gpls_woo_rfq_get_item(gpls_woo_rfq_cart_tran_key() . '_' . 'gpls_woo_rfq_cart');
if(is_array($gpls_woo_rfq_cart)){
$count = count($gpls_woo_rfq_cart); 
}else{
$count = 0;
}
?>
<script type="text/javascript">
var getQuoteIcon = document.getElementsByClassName("icon-account");
if(1 != 0) {
 getQuoteIcon[0].style.display = "none";
 }
</script>
<?php }
add_action('wp_footer','add_js_functions');