Pass PHP variable to .js file (jQuery)

Question

Let's say i have a variable in a php-file (index.php):

$PHP_variable = "string";

And i want to pass it to my JS file (functions.js) that's currently being read within the php-file. Is that possible?

For example, i have this in my php-file:

 <input type="text" name="textfield" value="'.$PHP_variable.'" />
 <input type="button" id="actionButton" />

And in the js-file:

$('#actionButton').click(function(){
 alert(THE_PHP_VARIABLE);
});

How is it possible to pass $PHP_variable to the js file? I'd prefer not to use the js code directly on the php-script (i know how to solve it that way).

Please use [a search engine](http://google.com) before asking questions. — Anonymous, May 16 '14 at 20:44
@SLaks i know but the data doesn't need to be protected in any way. — user2994294, May 16 '14 at 20:46
@user2994294: Unless your entire site has nothing remotely sensitive, an XSS vulnerability is still a big problem. — SLaks, May 16 '14 at 20:46
@Anonymous i did, but couldn't find anything relevant. Oh as i mentioned, **I'd prefer not to use the js code directly on the php-script**, which is what you just linked me — user2994294, May 16 '14 at 20:48
@user2994294 If you do not want to do that, you need to explain why. Just saying that the correct solution will not work is not enough. — Anonymous, May 16 '14 at 20:49

score 0 · Answer 1 · answered May 16 '14 at 20:44

It sounds like you're thinking of using PHP to generate Javascript, which is possible although it's a bit odd. It's also curious that you really aren't passing the variable, you're using it to render a javascript variable of the same value.

Instead, I think what you'd really want to do is use JS to read the variable from the HTML element's value attribute, since you're already storing the variable's value there.

This can be done a lot of ways, but since it looks like you're using jQuery it'd just be:

$('#actionButton').click(function(){
  $value = $this.attr('value');
  alert($value);
});

#actionButton doesn't have attribute 'value'. When you have error: $this will not work, you probably meant $(this) — Hrvoje Golcic, May 16 '14 at 20:53

score 0 · Answer 2 · answered May 16 '14 at 21:09

You were almost there -

$('#actionButton').click(function(){
    var THE_PHP_VARIABLE = $('input[name="textfield"]').val();
    alert(THE_PHP_VARIABLE);
});

Since the value is echo'd out when the page loads you can get that quite easily by using val() on the correct element.

If you want to assigned variables at the time the page is loaded you could also do this in your PHP -

<script type="text/javascript">
<?php
   echo "var THE_PHP_VARIABLE = " . $PHP_variable .";";
?>
</script>

score 0 · Answer 3 · answered May 16 '14 at 21:45

0

Thanks for all the answers, i chose to use a hidden input field with an id and the php-variable as the value for this input, then in the js-file i simply get the val() from this hidden input

$input_val = $('#hiddenInputID').val();

answered May 16 '14 at 21:45

user2994294

81
1
14

Pass PHP variable to .js file (jQuery)

3 Answers3