1

I'm trying to echo a dynamic a tag which calls a javascript function, but the parameters are not being echoed correctly. They should retain their capitalization and not add spacing. Why is it doing this?

I've tried removing variables and just echoing a straight string with what I want, but it still displays incorrectly.

What I need:

echo '<a href="'.$info[0].'" onClick="redirTrackCalcBtn("'.$bname.'", "'.$info[0].'")"><img src="'.$info[1].'"/></a>'

Pure String Version:

echo '<a href="/calc" onclick="redirTrackCalcBtn("Test_Button_1", "/calc")"><img src="/images/calc-eng-desktop.png"></a>'

Outputs:

<a href="/calc" onclick="redirTrackCalcBtn(" test_button_1",="" "="" calc")"="">
    <img src="/images/calc-eng-desktop.png">
</a>

Should Output:

<a href="/calc" onclick="redirTrackCalcBtn("Test_Button_1", "/calc")">
    <img src="/images/calc-eng-desktop.png">
</a>

I also tried:

echo "<a href=\"".$info[0]."\" onClick=\"redirTrackCalcBtn(\"".$bname."\", \"".$info[0]."\")\"><img src=\"".$info[1]."\"/></a>";

But that still outputs:

<a href="/calc" onclick="redirTrackCalcBtn(" test_banner_1",="" "="" calc")"=""><img src="/images/calc.png"></a>

as per Dharman's response I also Tried:

echo '<a href="'.$info[0].'" 
    onClick=\"redirTrackCalcBtn("'.$bname.'", "'.$info[0].'")\"
    ><img src="'.$info[1].'"/></a>'

This outputs:

<a href="/calc" onclick="\&quot;redirTrackCalcBtn(&quot;Test_Banner_1&quot;," "="" calc")\"="">
<img src="/images/preguntanos-h-es.png">
</a>

Edit for context: It's for a dynamic banner within the content of a blog powered by WordPress.

Mitch
  • 107
  • 1
  • 2
  • 9
  • @Dharman Which ones? I use single quotes as the php string identifier, so I don't see why I'd need to escape any double-quotes, I also tried switching to a double-quote identifyer and escaping every double-quote within the string and it still did not output correctly. – Mitch Jun 11 '19 at 22:50
  • Because HTML also uses double-quotes and so does Javascript. You have 3 layers, but you only have 2 possible quote types... – Dharman Jun 11 '19 at 22:51
  • @Dharman I tried yours aswell and reported the response in the comment, I'll add it to my original post aswell though – Mitch Jun 11 '19 at 23:12

3 Answers3

1

You can simplify your expressions using the following technique ...

  1. HTML accepts single quote or double quotes for attributes.
  2. PHP can evaluate variables inside of double quote delimited strings. This can make your expressions much more easier to understand.

So based on this, the answer would be:

<?php
echo "<a href='{$info[0]}' onClick='redirTrackCalcBtn(\"{$bname}\", \"{$info[0]}\")'><img src='{$info[1]}'/></a>";

This will give the following result ...

<a href='/calc' onClick='redirTrackCalcBtn("test_button_1", "/calc")'><img src='/images/calc-eng-desktop.png'/></a>

In your question, you have shown an Pure String Version and what you thought was a normal output. Both of those outputs are wrong. You cannot use something like onclick="redirTrackCalcBtn("Test_Button_1", "/calc")" because the double quote right after the opening parenthesis finishes the onclick attribute which become onclick="redirTrackCalcBtn(". After that, the browser will try its best to find the following attributes and their values. So the spaces that you are seeing are just the natural space between attributes.

In conclusion, there is nothing wrong with echo.

asiby
  • 3,229
  • 29
  • 32
0

You need to escape one set of the double-quotes, otherwise they are mixed together. Since you went for single-quotes in PHP, you need to use double in HTML/JavaScript and then use single-quotes again, but this time escaped from PHP.

echo '<a href="'.$info[0].'" onClick="redirTrackCalcBtn(\''.$bname.'\', \''.$info[0].'\')" ><img src="'.$info[1].'"/></a>';

The JavaScript variables are enclosed within \'

or

echo '<a href="'.$info[0].'" onClick=\'redirTrackCalcBtn("'.$bname.'", "'.$info[0].'")\' ><img src="'.$info[1].'"/></a>';

The onlick part is now enclosed with escaped quotes, everything else stayed the same.

You have 3 languages mixed together, 3 layers:

PHP will use '
-->HTML will use "
---->JavaScript will use \'

Each one uses double or single quotes and you only have two to choose from. Therefore you need to escape one of them.

A simpler example:

echo '<a onclick="alert(\'hi\')">Hello</a>';
Dharman
  • 30,962
  • 25
  • 85
  • 135
  • Now it's rendering the \ and some escape characters aswell as some other garbage `` – Mitch Jun 11 '19 at 22:55
  • I added some context in the question, but it's within the loop on a wordpress setup. It's for a dynamic banner to be displayed on the blog, specifically from content.php – Mitch Jun 11 '19 at 23:05
  • @MitchellLewis Sorry for my mistake, I updated the answer. – Dharman Jun 11 '19 at 23:27
0

Perhaps a simpler way to overcome quote escaping confusion is to assign the string in a different way. You can remove one layer of quotation by using heredoc notation.

as an aside, your "correct" output is not correct:
onclick="redirTrackCalBtn("Test_Button_1, "/calc")">

<a href="/calc" onclick="redirTrackCalcBtn("Test_Button_1", "/calc")">
  <img src="/images/calc-eng-desktop.png">
</a>

Your HTML should look like this:

<a href="/calc" onclick="redirTrackCalcBtn('Test_Button_1', '/calc')">
  <img src="/images/calc-eng-desktop.png">
</a>

Using Heredoc notation, you don't have to concatenate and escape, just write it out the way the HTML should be:

$link =<<<LINKINFORMATION
<a href="{$info[0]}" onclick="redirTrackCalcBtn('{$bname}', '{$info[0]}')">
  <img src="/images/calc-eng-desktop.png">
</a>
LINKINFORMATION;

echo $link;
Tim Morton
  • 2,614
  • 1
  • 15
  • 23