PHP include in JavaScript is not working

Question

I've JavaScript and I want to run a include script in the JavaScript . I tried the following statement:

outputEl.innerHTML = '<?php include "./change/ud1.php";?>';

When I run the script I get no response.

Does someone know why I didn't get any response and how I can fix it?

I tried to replace the PHP include with an html iframe. That worked but that is not the best solution for me.

Answer 1

No Need to use javascript in this case

you can use response directly where you want

<div id="outputEl"><?php include "./change/ud1.php";?></div>

Answer 2

You can't run php inside a .js file. As I understand it, you're going to need to fetch the content of the php file from your js file.

Here's a bare-bones implementation.

var xhr = new XMLHttpRequest();

xhr.onload = function () {
    outputEl.innerHTML = this.response;
};

xhr.open('GET', './change/ud1.php', true); // you may need to correct the url to be relative to the js file
xhr.send();

It might be easier and more robust to use jquery, in which case (once you've included the jquery library) you can just use something like this

$(outputEl).load("change/ud1.php");

Answer 3

• php is a server-side language.
• JavaScript is client side language.

so php can only execute on your server and JavaScript executes on user's browser.

there is no way in which php code going to run in JavaScript (browser). so you need to use ajax like this.

var xhttp = new XMLHttpRequest();

xhttp.onreadystatechange = function() {
    if (this.readyState == 4 && this.status == 200) {
        // server sent data successfully in this.responseText variable
        document.getElementById("output1").innerHTML = this.responseText;
    }
};

//Request data from a server
xhttp.open("GET", "path/to/php/include-script.php", true);
xhttp.send();

Learn more about ajax here.

Answer 4

You can also use jquery to load the content of the php file in your specified html element.

 $.get("path/to/yourfile.php", function(data, status){  
    outputEl.innerHTML = data;
});

Answer 5

Simply Use

<script type="text/javascript" src="filename.php"></script>

Also pass this header("Content-type: text/javascript"); on top of the php file.

Answer 6

This is not right approach. You should take html into a php variable and then use that PHP variable into JavaScript. If you are using MVC then its quite easy. I posted answer without using MVC :

$html = file_get_contents('path/to/YOUR/FILE.php');

In Javascript

var html = '<?php echo $html; ?>';

Answer 7

make single quotes to double quotes and try

Answer 8

You can't do this directly. If you want to replace the contents in this manner you have following two options

1. send AJAX request to that file and then that file will send the entire html as the data parameter of success function and then you can use that data wherever you want.

2. Or else you have to redirect to that page and you want some data to be sent to that file, then you can have as a get request.

   <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
   
   <script>    
       $.ajax({
          type: "POST",
          url: "<?php include "./change/ud1.php"; ?>",  //ensure URL is correct
          data: { }, //send some data if you want to that file or else remove this line
          dataType: "html",
          success: function(data) {
              if($.trim(data)) {
                   $('#outputEl').html(data);
              } else {
                   alert("Something went wrong!!");
              }
          }, error: function() {
              alert("ERROR!");
          }
      });
   </script>

And you can perform step 2 as

<script>
    window.location.href = "./change/ud1.php";  //And pass any parameters to that file if you wish as a GET request
</script>

Let me know if you require any further help

Answer 9

Two ways :

First:

 <script>
      document.write('<?php echo include_once "./change/ud1.php";?>');
   </script>

Second:

<script type="text/javascript" src="./change/ud1.php"></script>

Answer 10

Try this

$("#output1").load("change/ud1.php");

Answer 11

The PHP code is rendered on the server, with Javascript you are on the client and you can not render PHP if you are not on the server.

Answer 12

You can't do this because PHP code render before JavaScript. There are many alternative ways to do this:

if outputEl is a ID of a div element:

1- Without jQuery/JavaScript

<div id="outputEl"><?php include "./change/ud1.php";?></div>

2- Use jQuery load function

$("#outputEl").load('./change/ud1.php');

3- With JavaScript function

window.onload = function() {
  if (XMLHttpRequest)
    var x = new XMLHttpRequest();
  else
    var x = new ActiveXObject("Microsoft.XMLHTTP");
  x.open("GET", "./change/ud1.php", true);
  x.send();
  x.onreadystatechange = function() {
    if (x.readyState == 4) {
      if (x.status == 200)
        outputEl.innerHTML = x.responseText;
      else
        outputEl.innerHTML = "Error loading document";
    }
  }
}