PHP function HTML output shows in browser but not the Javascript innerHTML

I have a PHP function that queries a MySQL database and outputs an html table. This works fine with following PHP code:

<?php
showTable();
?>

But if I use the javascript code:

form.onsubmit = function() {
    document.getElementById("php_code").innerHTML="<?PHP sho开发者_StackOverflowwTable(); ?>";
};

the browser does not show the table. There seems to be a problem with the (innerHTML) html string. I noticed for example that a carriage return inside a MySQL parameter causes problem with the innerHTML, but not with the PHP-only code.

Is there a way to fix this?

(the reason I wish to use the javascript bit is to be able to have a form with two buttons with different PHP functions depending on the form buttons clicked).

---

Php runs on the server, it generates the html page, and returns it to the browser for rendering. Javascript runs in the browser -- which happens after the php has finished running. It is not possible to invoke a php function directly from within a javascript function.

In order to do what you're trying to do, you'll need to move your php code into its own PHP file, and use something like jQuery's load() function to invoke your php via a separate http request. Something like this:

form.onsubmit = function() {
    jQuery("#php_code").load('show_table.php');
};

where "show_table.php" contained something like this:

<?php 
    /** remember to include the function showTable()
     * here, so you can call it below.
     */
    function showTable() {
      /* your function source here */
    }

    showTable(); 

Hope this helps. You might also want to do some research on web applications in general -- specifically, read up on the roles that are played by PHP and Javascript respectively.

---

edit

If you understand the distinction I've outlined above, and your actual intention really is to have the php function run when the page is initially loaded, rather than waiting till the javascript function is called, then you can modify your code as follows:

form.onsubmit = function() {
    document.getElementById("php_code").innerHTML="<?PHP echo(addcslashes(showTable(), "\0..\37\\'\"/\177..\377")); ?>";
};

In order to use this approach, you will also need to make your function showTable() return the string rather than printing it out directly. One way to accomplish this is with php's output buffering functions. Just take your existing showTable() function, and wrap it like this:

function showTable() {
   ob_start();

   /* existing showTable logic goes here */

   return ob_get_clean();
}

---

You need to escape the output of showTable() properly if you want to do it in a variable like that.

However, I propose a different method for you. Include the HTML like this:

<script type="text/html" id="showTable">
    <?php showTable(); ?>
</script>

<script type="text/javascript">
form.onsubmit = function() {
    document.getElementById("php_code").innerHTML= document.getElementById('showTable').innerHTML;
};
</script>

Notice the use of type="text/html" in the previous script tag. This will cause the table not to be shown to the browser, but retrievable by javascript.

Good luck.

---

Two things:

• Be sure that no characters come out of showTable() that would interfere with the JavaScript code (like quotes)
• Convert new lines to break characters (nl2br()) in your showTable() function.