Skip to content
Related Articles

Related Articles

Improve Article
How to pass variables and data from PHP to JavaScript ?
  • Difficulty Level : Easy
  • Last Updated : 12 Dec, 2019

In this article, let’s see how to pass data and variables from PHP to JavaScript.

We can pass data from PHP to JavaScript in two ways depending on the situation. First, we can pass the data using the simple assignment operator if we want to perform the operation on the same page. Else we can pass data from PHP to JavaScript using Cookies. Cookie work in client-side.

Program 1: This program passes the variables and data from PHP to JavaScript using assignment operator.




<!DOCTYPE html>
<html>
  
<head>
    <title>
        How to pass variables and data
        from PHP to JavaScript?
    </title>
</head>
  
<body style="text-align:center;">
      
    <h1 style="color:green;">GeeksforGeeks</h1>
      
    <h4>
        How to pass variables and data
        from PHP to JavaScript?
    </h4>
      
    <?php
        $name = "Hello World";
    ?>
  
    <script type="text/javascript">
        var x = "<?php echo"$name"?>";
        document.write(x);
    </script>
</body>
  
<html>

Output:

Here, we just take input by statically or dynamically and pass it to JavaScript variable using the assignment operator. The PHP code in the JavaScript block will convert it into the resulting output and then pass it to the variable x and then the value of x is printed.



Program 2: This program passes the variables and data from PHP to JavaScript using Cookies.




<!DOCTYPE html>
<html>
  
<head>
    <title>
        How to pass variables and data
        from PHP to JavaScript?
    </title>
</head>
  
<body style="text-align:center;">
      
    <h1 style="color:green;">GeeksforGeeks</h1>
      
    <h4>
        How to pass variables and data
        from PHP to JavaScript?
    </h4>
      
    <?php
          
        // Initialize cookie name
        $cookie_name = "user";
        $cookie_value = "raj";
          
        // Set cookie
        setcookie($cookie_name, $cookie_value);
          
        if(!isset($_COOKIES[$cookie_name])) {
            print("Cookie created | ");
        }
    ?>
  
    <script type="text/javascript">
        var x = document.cookie;
        document.write(x);
    </script>
</body>
  
<html>

Output:

PHP provides a method to set the cookie using the setCookie() method. Here, we can set the data or variable in PHP cookie and retrieve it from JavaScript using document.cookie.

Steps to Run the program:

  • Install local server like XAMPP server into your system.
  • Save the file in htdocs folder using the name geeks.php
  • Start Apache server.
  • Open Browser and type localhost/geeks.php in address bar and hit Enter button.
  • It will display the result.



My Personal Notes arrow_drop_up
Recommended Articles
Page :