js changes src on php file

Question

so I had to ask a question because it won't let me comment yet. I used the code provided by RC as an answer here Change image source with javascript

but because my file isnt .html, its .php and I have my html code all on echo, the source code ends up looking like this:

Here's the js included in the .php file

<script>
    function backColor(a) {
        document.getElementById("back_image").src=a;
    }
</script>

(Thanks RC!)

Here's the .php

<?php
$cush_patterns = array();

$cush_patterns[101] = array(
    "pattern" => "Ocean Blue",
    "img" => "img/cush/blue.gif",
    "color" => "blue",
    "price" => 22.22
    );

$cush_patterns[102] = array(
    "pattern" => "Yellow sun",
    "img" => "img/cush/yellow.gif",
    "color" => "yellow",
    "price" => 28.99
    );

echo '<img id="back_image" src="img/cush/blue.gif">';
echo '<ul>';
echo'<li>';
echo '<img class="cush_showcase" src="' . $cush_pattern["img"] . '" onclick="backColor("' . $cush_pattern[img] . '");">';
echo '</li>';
echo '</ul>';
?>

and here is the source code I get when I run it all

<ul class="cush_show">
<li>
<img class="cush_showcase" src="img/cush/blue.gif" onclick="backColor("img/cush/blue.gif");">
<h6 id="patt_name">Ocean Blue</h6>
<h6 id="prices">$22.22</h6>
</li>
</ul>

<ul class="cush_show"><li>
<img class="cush_showcase" src="img/cush/yellow.gif" onclick="backColor("img/cush/yellow.gif");">
<h6 id="patt_name">Yellow sun</h6>
<h6 id="prices">$28.99</h6>
</li>
</ul>

It's probably something obvious, but I can't put my finger on it and it's driving me insane.

Thank you in advance!

change it in single quote for `backColor("img/cush/blue.gif");` — Tamil Selvan C, Jun 24 '14 at 03:03
And yes, I agree with @TamilSelvan. When writing or executing a JS function, strings should be in single quotes, as html parameters use double quotes. — CJT3, Jun 24 '14 at 03:10
What's wrong with it is that it doesn't work but I don't get why. I'm going to try changing the quotes. Thanks! — user3696010, Jun 24 '14 at 15:29

score 0 · Answer 1 · answered Jun 25 '14 at 23:32

So here is how I solved it, after searching all over the internet. Thanks @Tamil Selvan, @Charles John Thompson III for your comments, they helped too!

<?php
$cush_patterns = array();

$cush_patterns[101] = array(
    "pattern" => "Deep ocean blue",
    "img" => "img/cush/blue.gif",
    "color" => "blue",
    "price" => 29.99
    );

$cush_patterns[102] = array(
    "pattern" => "Spring yellow",
    "img" => "img/cush/yellow.gif",
    "color" => "yellow",
    "price" => 28.99
    );

echo '<img id="back_image" src=\'' . $cush_patterns["img"] . '\'>';
echo '<ul class="cush_show">';
echo '<li>';
echo '<img class="cush_showcase" alt="Your patterns" src=\'' . $cush_pattern["img"] . '\' onclick="backColor(\'' . $cush_pattern["img"] . '\')">';
echo '</li>';
echo '</ul>';
?>

js changes src on php file

1 Answers1