Calling a PHP variable in jQuery

Question

I'am developing a zoom tool in my shopping cart and I am stuck on how to call a PHP variable in a jQuery function.

Here's my code :

jQuery(document).ready(function($){
$('#image1').addimagezoom({ // single image zoom
    zoomrange: [3, 10],
    magnifiersize: [800,300], 
    magnifierpos: 'right',
    cursorshade: true,
    largeimage: "php variable" //we add the directory of the image.
});
});

I need to put

$src ="images/products/".mysql_result($execute_select_product_query,0,'image1')."

in my function where I put PHP variable.

You can't. Not without AJAX or include your JavaScript function inside a PHP file. — putvande
– putvande, Commented Aug 14, 2013 at 11:19

Wren · Accepted Answer · 2013-08-14 11:23:38Z

You have two or three options: if the Javascript is in the php file, you can

var phpVar = <?php echo $var; ?>;

Otherwise if the Javascript is anywhere at all, you can do:

<input type="hidden" id="phpVar" value="<?php echo $var; ?>">

and then access it as

$('#phpVar').val();

Example 1:

jQuery(document).ready(function($){
$('#image1').addimagezoom({ // single image zoom
    zoomrange: [3, 10],
    magnifiersize: [800,300], 
    magnifierpos: 'right',
    cursorshade: true,
    largeimage: <?php echo $var; ?> //we add the directory of the image.
});
});

Example 2:
Html:

<input type="hidden" id="phpVar" value="<?php echo $var; ?>">

Javascript

jQuery(document).ready(function($){
$('#image1').addimagezoom({ // single image zoom
    zoomrange: [3, 10],
    magnifiersize: [800,300], 
    magnifierpos: 'right',
    cursorshade: true,
    largeimage: $('#phpVar').val(); //we add the directory of the image.
});
});

Sahil Mittal · Accepted Answer · 2013-08-14 11:19:56Z

5

Do it like this:

largeimage: "<?php echo $src; ?>"

answered Aug 14, 2013 at 11:19

Sahil Mittal

20.7k12 gold badges68 silver badges91 bronze badges

5 Comments

putvande Over a year ago

What if the OP's jQuery is not inside a PHP file?

André Dion Over a year ago

Note that this will only work if your PHP script actually outputs JavaScript inline or serves up the JS as text/javascript.

Sahil Mittal Over a year ago

He have not mentioned that, so as per normal understanding it seems that his function is in the same PHP file.

Asif Salahuddin Ghazi Over a year ago

@AnthonyG.Helou have you fetched that database output separately in a variable and tested?

Sahil Mittal Over a year ago

Could you edit and extend your ques, and add the code where you had defined the PHP variable

m1k1o · Accepted Answer · 2013-08-14 11:23:59Z

4

PHP is server side language and javascript is user side language. Don't mix it. Just use ajax. Or if you have included your script into the PHP file, you can write it to code:

  <?php $srcImg = 'Some value'; ?>
  jQuery(document).ready(function($){
    $('#image1').addimagezoom({ // single image zoom
        zoomrange: [3, 10],
        magnifiersize: [800,300], 
        magnifierpos: 'right',
        cursorshade: true,
        largeimage: "<?php echo $srcImg; ?>" //we add the directory of the image.
    });
  });

Ou use data-attrs

<body data-phpvar="<?php echo $srcImg; ?>">

And in js:

var phpvar = $("body").attr("data-phpvar");

answered Aug 14, 2013 at 11:23

m1k1o

2,36416 silver badges27 bronze badges

1 Comment

Jako Over a year ago

Depending on which version of jQuery he's using, you can also do. var phpvar = $("body").data("phpvar");

Sal00m · Accepted Answer · 2013-08-14 11:38:08Z

2

You can use the php tags to echo your variable:

jQuery(document).ready(function($){
$('#image1').addimagezoom({ // single image zoom
    zoomrange: [3, 10],
    magnifiersize: [800,300], 
    magnifierpos: 'right',
    cursorshade: true,
    largeimage: "<?=$your_php_variable?>" //we add the directory of the image.
});
});

Edited: If jQuery is not included in php file then you can declare a javascript variable into the php file:

<?
php code
?>
<script type="text/javascript">
var my_js_variable = '<?=$my_php_variable?>';
</script>
<?
php code
?>

edited Aug 14, 2013 at 11:38

answered Aug 14, 2013 at 11:22

Sal00m

2,9143 gold badges24 silver badges33 bronze badges

1 Comment

Asif Salahuddin Ghazi Over a year ago

Unnecessary inclusion of print functions.

Padmanathan J · Accepted Answer · 2013-08-14 11:24:17Z

1

Add php tag into your jquery "<?php echo $sample; ?>"

jQuery(document).ready(function($){
$('#image1').addimagezoom({ // single image zoom
    zoomrange: [3, 10],
    magnifiersize: [800,300], 
    magnifierpos: 'right',
    cursorshade: true,
    largeimage: "<?php echo $sample;?>" //we add the directory of the image.
});
});

answered Aug 14, 2013 at 11:24

Padmanathan J

4,6305 gold badges39 silver badges76 bronze badges

Collectives™ on Stack Overflow

Calling a PHP variable in jQuery

5 Answers 5

Comments

5 Comments

1 Comment

1 Comment

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

5 Answers 5

Comments

5 Comments

1 Comment

1 Comment

Comments

Your Answer

Sign up or log in

Post as a guest

Related