Expressing php code in Javascript

Question

I am trying to insert html code through a php variable in javascript. I am getting the following error below. Please can someone advise?

Error Message: "Unexpected Identifier 'Inactive'" ($option has values 'Inactive'/ 'Active')

PHP

$tr_active_Options = '';
$sql1 = "SELECT status FROM tr_active";
$result = $mysqli -> query($sql1);
while($row = $result -> fetch_assoc()){
$option = $row['status'];

$option = '<div class="dpOtions" onclick="track.addChosenOption(\''.$option.'\', \'act_ui\')">'.$option.'</div>';

$tr_active_Options .= $option;
}


$tr_active = '<div class="drpClass"><div class="dropOptionsDiv" id="actList_ui">'.$tr_active_Options.'</div></div>';

JAVASCRIPT

document.getElementById('anchor').innerHTML = '<div id="editWrap"><?php echo $tr_active; ?></div>';

T.J. Crowder · Accepted Answer · 2017-03-02 13:20:37Z

1

The ' in your string are terminating the JavaScript string you've started with '.

You can safely have PHP generate a string for use in JavaScript using json_encode, like so:

document.getElementById('anchor').innerHTML =
    '<div id="editWrap">' +
    <?php echo json_encode($tr_active); ?> +
    '</div>';

Note how the JavaScript string ends, then we use + to join it with the one that PHP will output (json_encode will handle the strings), then we + it with another JavaScript string after it. What the browser will see will look like this:

document.getElementById('anchor').innerHTML =
    '<div id="editWrap">' +
    "contents of $tr_active here" +
    '</div>';

...which is valid.

That said: Using PHP to generate HTML with embedded JavaScript inside attributes is asking for a world of hurt. Separate those concerns! :-)

edited Mar 2, 2017 at 13:20

answered Mar 2, 2017 at 11:25

T.J. Crowder

1.1m201 gold badges2k silver badges2k bronze badges

Sign up to request clarification or add additional context in comments.

Collectives™ on Stack Overflow

Expressing php code in Javascript

1 Answer 1

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Related