How To Set Php Variable Value In Javascript

Pass Variable From PHP to JavaScript

Created: May-01, 2022

Use AJAX to Pass the PHP Variable to JavaScript
Use JavaScript to Escape the PHP Scripts to Laissez passer the PHP Variable to JavaScript
Utilise the Brusque PHP Repeat Tag, <?=?> Inside the JavaScript to Pass the PHP Variable to JavaScript

We volition innovate a way to pass the PHP variable to JavaScript using AJAX. This method requests the data from the PHP server and runs on the client machine.

We will besides demonstrate another method to laissez passer the PHP variable in JavaScript by escaping the PHP to JavaScript. Nosotros write JavaScript subsequently the PHP scripts to escape the PHP.

We volition show you another example to laissez passer the PHP variable to JavaScript using the short echo tag in the JavaScript as <?=$var?> where $var is the PHP variable.

Utilize AJAX to Pass the PHP Variable to JavaScript

We tin can utilize AJAX to get the information and variables from the PHP server to JavaScript. This method has separate server-side and client-side scripts. It makes the code cleaner and enhances the code readability. AJAX stands for Asynchronous JavaScript and XML. It uses the XMLHttpRequest object to request the data from the server. Information technology displays the data using JavaScript and HTML DOM. This process occurs asynchronously, which means the changes happen in the webpage without the page being reloaded. However, there is latency when AJAX is used over networks because it sends the HTTP asking. In this method, nosotros write JavaScript code in the PHP file.

For instance, create a PHP file named index.php. Write the JavaScript code inside the <script> tag. Create a vairable req using the var keyword. Create a request object of the XMLHttpRequest() role and assign information technology to the req variable. Telephone call the onload() part with the req object using the function expression. Inside the role, utilize the console.log() function to log the this.responseText holding. Do not forget to end the function expression with a semicolon. Use the req object to phone call the open() function. Supply get, get-data.php and true simultaneously as the parameters in the function. Telephone call the send() function with the req object. Create another PHP file named get-data.php. Assign a value of Mountain to $var variable. Repeat the json_encode() office with the $var every bit the parameter.

In the example below, nosotros created a request object with the XMLHttpRequest() function. The onload() part handles the operation to be performed during the response. The open up() office specifies the HTTP method, the PHP file that sends the JSON response, and a boolean value that controls the balance of the execution of the script. The json_encode() part in the go-data.php file sends the response in JSON format. Hither, we printed the variable $var in the console.

Example Code:

              # php 7.* <?php ?> <script> var req = new XMLHttpRequest();      req.onload = role() {     console.log(this.responseText);   }; req.open("get", "become-data.php", truthful);  req.send(); </script>

              # php seven.* <?php $var = "Mountain"; repeat json_encode($var);  ?>

Output:

              "Mountain"

Utilize JavaScript to Escape the PHP Scripts to Laissez passer the PHP Variable to JavaScript

We tin can use JavaScript after the PHP tags to escape the PHP scripts. We tin create a PHP variable in the PH P script. And so, nosotros can write the JavaScript to escape the higher up-written PHP and pass the variable inside the JavaScript code. Within the JavaScript, we can utilise the PHP tag to echo the PHP variable assigning it to a JavaScript variable.

For case, assign a value Metallica to a variable $var inside the PHP tags. Write a script tag and inside it, write a PHP tag. Inside the PHP tag, echo a JavaScript variable jsvar. Assign the PHP variable $var to jsvar. Do not forget a quote wrapped effectually the $var and a semicolon after it. Close the PHP tag and log the value of jsvar using the console.log() office. Shut the script tag. In the instance below, we accept logged the PHP variable $var in the panel using JavaScript. We can see the output in the console of the webpage.

Case Code:

              #php seven.x <?php $var = 'Metallica'; ?> <script>    <?php        echo "var jsvar ='$var';";    ?>    console.log(jsvar);  </script>

Output:

              Metallica

Use the Short PHP Echo Tag, `<?=?>` Inside the JavaScript to Pass the PHP Variable to JavaScript

We can use the short PHP repeat tag inside the JavaScript to pass the PHP variable to JavaScript. Nosotros can apply the short PHP repeat tag to get rid of the hassle of writing the PHP tag and the echo statement. It is a short-manus method. This method is very much similar to the 2d method in terms of the concept and the execution.

For example, assign a value Megadeth to a variable $var inside the PHP tags. Open a script tag and create a JavaScript variable jsvar. Write the short-hand echo tag <?=$var?> as the value of the jsvar variable. Log the variable using the console.log() function. We can view the output of the script in the console of the webpage.

Code Instance:

              #php 7.x <?php $var = 'Megadeth'; ?> <script>     var jsvar = '<?=$var?>';     console.log(jsvar);  </script> ?>

Output:

              Megadeth

Write for us

DelftStack articles are written by software geeks like you. If you also would like to contribute to DelftStack past writing paid articles, you can check the write for us page.