Javascript error, function not defined when it is clearly defined

Question

So, I have page where a PHP script echoes out all of my HTML including some javascript. The javascript function in question is supposed to be executed when a select box is changed but everytime I change the select box I get an error in my javascript console saying that the function is undefined.

I've even reduced the function to simply displaying an alert box to help in debugging but I'm still getting the error.

Here's the PHP function responsible for creating the select box:

function CreateMainSelect()
{
    $html = "<select name=\"main_select\" onChange=\"test()\" id=\"main_select\" >";
    $html .= "<option value='all'>All</option>";
    $html .= "<option value='past'>Past</option>";
    $html .= "<option value='current_and_future'>Current and Future</option>";
    $html .= "<option value='date_range'>Date Range</option>";
    $html .= "</select>";

    return $html;
}

Totally unnecessary to have it in a function but I need to slightly modify another similar function already in place so please don't be too upset with me!!

And here's the echoed javascript function:

echo '<script type="text/javascript">';
echo 'function test()';
echo '{';
echo 'alert("hello world");';
echo '}';
echo '</script>';

The javascript is being echoed out at the bottom of the PHP file. I've tried moving it to the top as well but that didn't change anything.

EDIT: Thanks for the replies everyone, all of your advice has been very helpful. I figured out the problem and as many as two things were going wrong. The first problem was that my browser was (I think anyways) caching my javascript so older buggy versions of my function were getting called which was why a perfectly fine function was appearing to create errors. Solved by clearing my cache.

The other problem (I think) was that the javascript function was not, in fact, being loaded before it was being executed. I solved this by putting the javascript in a separate.JS file and linking it to the.PHP file.

Answer 1

It seems to be working perfectly fine over here:

PHP: http://codepad.org/CGY47E1G

HTML: http://jsfiddle.net/maniator/9BCfv/

Answer 2

Your code snippets look solid (although I would add newlines to the end of your echos to make the result more readable). You might have an error somewhere else in your javascript that's preventing your function from being loaded.

Answer 3

You should be using HEREDOC s to produce that javascript. It saves you the trouble of escaping all the internal quotes. If you're not interpolating PHP variables, you can use the NOWDOC variant, which saves you a teensy bit of PHP compiler overhead.

function CreateMainSelect() {
   $html = <<<EOL
<select name="main_select" onChange="test()" id="main_select" >
    <option value='all'>All</option>
    etc...
</select>
EOL;
   return $html;
}

echo <<<EOL
<script type="text/javascript">
    function test() {
        alert("hello world");
    }
</script>
EOL;

Far easier to read... Even better would be to drop out of PHP mode for the echo block. Any decent syntax highlighting editor will then be able to recognize the javascript and color it appropriately.