How to write php code inside jquery

Question

I tried all possible ways to write php code inside a jquery code. Here is my code snippet:

 $('body').on('click', '.add_more', function(){
     var plugin_dir = "<?php plugins_url(); ?>";
     console.log(plugin_dir);
 });

Even I tried as follows:

$('body').on('click', '.add_more', function(){
    var plugin_dir = <?php plugins_url(); ?>;
    console.log(plugin_dir);
});

I am writing this code inside a wordpress plugin php file. I apologize if this question is duplicate. It kills my day. Any idea?

Your first attempt should be working. Make sure plugins_url() actually writes something and doesn't just returns the value. Try replacing plugins_url() with echo 'hello' and see if it works. — VVV
– VVV, Commented Feb 13, 2018 at 5:45
Thanks for your time. I changed accordingly and now I can see <?php echo 'hello'; ?> in my console log — Abdus Sattar Bhuiyan
– Abdus Sattar Bhuiyan, Commented Feb 13, 2018 at 5:50

obiPlabon · Accepted Answer · 2018-02-13 06:08:20Z

2

Instead of assigning value that way you can use wp_localize_script() or wp_add_inline_script() and create a plugin configuration JS object to use that everywhere.

PHP file

add_action( 'wp_enqueue_scripts', function() {
    wp_enqueue_script(
        'script-handle',
        'your-script-uri/script.js',
        array( 'jquery' ),
        'version',
        true
    );

    wp_localize_script( 
        'script-handle',
        'pluginNameSpace',
        array(
            'url' => plugins_url()
        )   
    );
} );

JS file

$('body').on('click', '.add_more', function(){
    console.log( pluginNameSpace.url );
});

edited Feb 13, 2018 at 6:08

answered Feb 13, 2018 at 6:00

obiPlabon

6234 silver badges11 bronze badges

Sign up to request clarification or add additional context in comments.

3 Comments

Abdus Sattar Bhuiyan Over a year ago

Would you say in more detail please. It seems to me it will be good practice you are mentioning.

obiPlabon Over a year ago

@AbdusSattarBhuiyan please check added an example. You'll get more details if you check those function doc. And yes it's best practice.

Andrew Schultz Over a year ago

Agreed this is the best method rather than using the hack in your question.

Vidya L · Accepted Answer · 2018-02-13 06:02:01Z

0

You just need to echo the plugins_url()

$('body').on('click', '.add_more', function(){
     var plugin_dir = "<?php echo plugins_url(); ?>";
     console.log(plugin_dir);
 });

answered Feb 13, 2018 at 6:02

Vidya L

2,3344 gold badges30 silver badges44 bronze badges

1 Comment

Abdus Sattar Bhuiyan Over a year ago

Now I can see <?php echo plugins_url(); ?> in console log

Collectives™ on Stack Overflow

How to write php code inside jquery

2 Answers 2

3 Comments

1 Comment

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

3 Comments

1 Comment

Your Answer

Sign up or log in

Post as a guest

Related