How do I insert a php variable into my javascript?

Question

I am having issues inserting a php variable into my javascript code. I have a php page that calls javascript code using a tag. Doing just that, I am able to successfully run the javascript on the php page. However, the javascript code breaks as soon as I try and insert a php variable.

One method I tried was writing the script code like normal, and inserting into the script, but that breaks the page.

$(document).ready(function() {

    $('#calendar').fullCalendar({
        defaultDate: this.date,
        editable: false,
        eventLimit: true, // allow "more" link when too many events
        events: [
            {
                title: <?php 
                $em = 'edfetsko@gmail.com';
                echo $em; ?>,
                start: '2015-02-01'
            }]
    });

});

My other attempt was to try and contain all of the above code (including tags) as a php string and then print/echo it to the page, but that didn't work either (for some reason it just printed '0').

What is the best way to achieve what I'm going for?

Look at your generated JavaScript source. The email address isn't in quotes. — elixenide, Oct 21 '15 at 05:59
Assign the value of the variable to a hidden field and then use that value in javascript. — Mayank, Oct 21 '15 at 06:00
If you are just hard coding email why cannot you use title:'edfetsko@gmail.com' — chandresh_cool, Oct 21 '15 at 06:02
Duplicate of http://stackoverflow.com/questions/23740548/how-to-pass-variables-and-data-from-php-to-javascript and http://stackoverflow.com/questions/8280204/how-to-use-a-php-variable-in-javascript and http://stackoverflow.com/questions/5310216/passing-php-variable-into-javascript and about 3-dozen others. — Stephen P, Oct 21 '15 at 06:26
When you type the title of your question after hitting the "Ask Question" button, it suggests some "Questions that may already have your answer". I typed your title in and it came up with 24 questions. Did you look at _any_ of those? — Stephen P, Oct 21 '15 at 06:29
@chandresh_cool Because the value of the variable didn't actually matter to me in this case. I only wrote it like that to narrow down the problem. I'm actually going to be displaying a calendar that automatically pulls events from a database. — user3225440, Oct 21 '15 at 20:25
@StephenP Yeah, I did, but I still couldn't get it to work. That's why I had it mostly right to begin with. The only thing that was making it fail was the lack of quotes and those other questions wouldn't have helped me in that regard. — user3225440, Oct 21 '15 at 20:27

score 2 · Accepted Answer · answered Oct 21 '15 at 06:01

2

You have to add quotes to your javascript code because the mail address is a string:

title: '<?php 
$em = 'edfetsko@gmail.com';
echo $em; ?>',
start: '2015-02-01'

answered Oct 21 '15 at 06:01

mario.van.zadel

2,919
14
23

Thank you, it was the quotes that I was missing. I guess I was thinking it would be interpreted as a string automatically because I would have been able to put a javascript variable there without the quotes. But the php interpreter turns the php variable from variable form to text by the time it reaches the script. – user3225440 Oct 21 '15 at 06:28

score 2 · Answer 2 · answered Oct 21 '15 at 06:22

You can pass value from php to java script. Please check following example to pass value from .php file to .js -

example.php

 <?php 
    //exp_var value we need to pass
    $exp_var = 'hello';    
    ?>
    <script>
    var php_value_of_var = <?php echo $exp_var ?>
    </script>

After create above changes in php you can use 'php_value_of_var' in your jscript directly.

'php_value_of_var' - it indicates value which passed from php file.

Anto S · Answer 3 · 2015-10-21T06:23:40.793

Solution 1:

Using php tag inside jquery will work only of your file extension in which your javascript exist is .php otherwise assign this into a variable in your header php file as below

<?php
     var EMAIL = '<?php echo $email; ?>';
?>

And then use it in your script like below

$(document).ready(function() {

    $('#calendar').fullCalendar({
        defaultDate: this.date,
        editable: false,
        eventLimit: true, // allow "more" link when too many events
        events: [
            {
                title: EMAIL,
                start: '2015-02-01'
            }]
    });

});

But make sure that your header file included just before the jScript

Solution 2

If your javascript is already in .php extension file you can directly use like

$(document).ready(function() {

    $('#calendar').fullCalendar({
        defaultDate: this.date,
        editable: false,
        eventLimit: true, // allow "more" link when too many events
        events: [
            {
                title: '<?php echo $em; ?>',
                start: '2015-02-01'
            }]
    });

});

How do I insert a php variable into my javascript?

3 Answers3