How to use php code in javascript

Question

I have a javascript file grid.js that containsthe following code

Preview.prototype = {
 create : function() {
 // create Preview structure:
 this.$title = $( '<h3></h3>' );
 this.$description = $( '<p></p>' );
 this.$href = $('<div class="showbutton"><form id="myform" method="POST" action="#"><div class="linkbtn02"><a href="#">EVOEGEN</a></div></form></div>' );
 this.$details = $( '<div class="og-details"></div>' ).append( this.$title, this.$description, this.$href );
 this.$loading = $( '<div class="og-loading"></div>' );
 this.$fullimage = $( '<div class="og-fullimg"></div>' ).append( this.$loading );
 this.$closePreview = $( '<span class="og-close"></span>' );
 this.$previewInner = $( '<div class="og-expander-inner"></div>' ).append( this.$closePreview, this.$fullimage, this.$details );
 this.$previewEl = $( '<div class="og-expander"></div>' ).append( this.$previewInner );
 // append preview element to the item
 this.$item.append( this.getEl() );
 // set the transitions for the preview and the item
 if( support ) {
 this.setTransition();
 }
 },
}

But I would like to use dynamic values for this.$href attribute.

It will be like this

this.$href = $('<div class="showbutton"><?php woocommerce_quantity_input(); ?></div>' );

Can someone tell me how to use that inside php?

Please note, I have a foreach loop. So that line will be different for each loop.

• putvande: You can't. It is a js file, so you can't have PHP in it. Unless you change you change your file extension to be .php or change the way the server handles JS files.
• PrivateUser: I know I cannot use php inside external js file.Thats why I asked this question. I meant I would like to use that one line in my php file
• Entoarox: You would need to have your php output the data in a way that allows javascript to loop over it. It is simply impossible to cross client and server code like you are asking.
• Jon: There is absolutely nothing preventing your from doing <script src="myfile.php"></script> and having your PHP code dynamically generate JS. Don't forget to begin with header('Content-Type: text/javascript').
• PrivateUser: @everyone Ok guys.. I end up using ajax. I thank you all.

Answer 1

What you can do is pass the variable from outside that .js file, like this:

// index.php
<div class="row">
 <div class="small-12 columns">
 page content
 </div>
</div>
<script>var test = '<?php echo $variable; ?>';</script>

and then reference that variable the same as if you defined it within that .js file (mind the potential scope issue).

• Mousa Alfhaily: This is way easier than changing the .JS file to .PHP file and having your PHP code dynamically generate JS code, BUT... this is way less secure since anyone can change the value of that JS variable easily with the power of the browser's DevTool.