how to insert php code inside javascript code

Question

I need to store the content of story inside mysql table.

This content will later be normally loaded on another page using php.

piano.php is a third, separate file and I don't want it on the current page, but only on the target page.

So I'm trying to insert php code inside story content but it is automatically commented (see in console);

How to do this?

$('button').on('click', function() {
  var a = "<div class='part partpiano'><?php include('piano.php');?></div>";
  $(a).insertBefore($('.title'));
  console.log($('.story').html());
});

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>

<div class='story'>
  <div class='title'>lorem</div>
</div><br>
<button>CLICK</button>

`php` is server side language,`javascript` is client side language,how can you manipulate server side via client side? — lucumt, Dec 14 '18 at 10:02
@TarangP, I'm using ajax, of course, but I firstly need the propper content as a variable — , Dec 14 '18 at 10:04
@MasivuyeCokile, using `load` on target page will make page loading slow. — , Dec 14 '18 at 10:05
You're adding HTML to the page _**after**_ PHP has finished executing. PHP runs on the server, creates HTML and then sends it to the browser. If you try to add PHP to the page at that point then _**it is running in your browser - NOT your web server**_, so PHP commands do not work. You can add the element to the page and then use `$(".part.partpiano").load("piano.php");` to ask your web server to parse the PHP file and return the results (HTML). — Reinstate Monica Cellio, Dec 14 '18 at 10:35
Possible duplicate of [jQuery AJAX submit form](https://stackoverflow.com/questions/1960240/jquery-ajax-submit-form) — Eriks Klotins, Dec 14 '18 at 10:37
@EriksKlotins OP mentions storing something in a database, but the question **is not** about posting a form. Please read the whole question and look at the code to see what OP is actually trying to do. — Reinstate Monica Cellio, Dec 14 '18 at 10:41
@Archer, of course, I said want to store the code inside a table, and not to execute on the current page. — , Dec 14 '18 at 10:56
It's really a question of what type of file you are using. Is it a .php file? Go ahead! Drop some php in the middle of that JS! Is it a .js file? It won't work — Neil VanLandingham, Dec 14 '18 at 12:13

score 1 · Accepted Answer · answered Dec 14 '18 at 10:48

It's a much better practice to avoid mixing PHP with JavaScript. PHP is a server-side language and as a result, executes differently from the browser. It can work but usually leads to unexpected behaviour and for the most part, it's much cleaner to keep everything separate.

You can achieve passing data between PHP and JS using hidden inputs or DOM elements with data-* attributes, e.g.

<div id="php-data" data-id="<?php echo $foo; ?>"></div>

then in your jQuery

let id = $('#php-data').attr('data-id');

However, for your problem in particular (as it's an include). It's much much better to simply include the file on load using a class of hidden:

css:

.hidden {
    display: none
}

html/php:

<div class="title">
    <div class="part partpiano hidden">
        <?php include_once 'piano.php'; ?>
    </div>
</div>

Then in your JS:

$('button').click(function()
{
    $('.part').removeClass('hidden')
})

score 0 · Answer 2 · answered Dec 14 '18 at 10:47

0

You can't include PHP in your page in the way you've tried, as you've found. PHP is executed on the server and the results are returned to your browser, so if you add PHP with Javascript then it's not executed/parsed and is just added as text (your browser cannot execute PHP).

What you can do is add the container element to the page and then load the contents afterwards, like this...

$('button').on('click', function() {
  var a = "<div class='part partpiano'>Loading...</div>";
  $(a).insertBefore($('.title'));
  $(a).load("piano.php");
});

answered Dec 14 '18 at 10:47

Reinstate Monica Cellio

24,939
6
47
65

ah, forgot about .load() ... #JSScrub – treyBake Dec 14 '18 at 10:48
Aren't you assuming that he is trying to include php in a javascript file? I think he is trying to include javascript in a php file... which is entirely possible – Neil VanLandingham Dec 14 '18 at 11:05
@Weft I've read the code - if it's an incorrect assumption then the OP can tell me, but to me no, it does not look vaguely like they're trying to store javascript in a PHP file. This is very a common mistake that people make. – Reinstate Monica Cellio Dec 14 '18 at 11:11
@Weft that's not what OP is doing, they're including this HTML snippet `
` and then attempt to insert it before `.title` - there is no desire to use JS in PHP but to use PHP in JS - which won't work. – treyBake Dec 14 '18 at 11:44
@Weft - we disagree. Discuss this with the OP, not me. Okay? – Reinstate Monica Cellio Dec 14 '18 at 11:49
@Archer, pls point the part of my post where you saw I want include js inside php? – Dec 14 '18 at 11:56
1

@puerto Archer doesn't **weft** does - please follow comment thread closely – treyBake Dec 14 '18 at 12:02

how to insert php code inside javascript code

2 Answers2