Why am I getting this Javascript error "connection is not defined"?
<p>I'm not sure why I'm getting this error:</p>

<pre><code>connection is not defined   
document.getElementById("flashTest").sendValFromHtml(connection.value);
</code></pre>

<p>This is my code:</p>

<pre><code>function submitCheck() {
    var hasConnection = document.getElementById("formTest").connection.value.length != 0; 
    var hasLocation = document.getElementById("formTest").location.value.length != 0;

    document.getElementById("connection").className = hasConnection ? "" : "invalid";
    document.getElementById("location").className = hasLocation ? "" : "invalid";

    if(hasConnection &amp;&amp; hasLocation){
        document.getElementById("flashTest").sendValFromHtml(connection.value);
    }
}
</code></pre>

<p>HTML:</p>

<pre><code>&lt;form id="formTest" name="formTest" method="post" action=""&gt;
    &lt;fieldset class="form"&gt;
        &lt;div class="connection"&gt;
            &lt;label id="connection"&gt;Connection:*&lt;/label&gt;
            &lt;div class="textwrapper"&gt;
                &lt;select name="connection"&gt;
                    &lt;option value=""&gt;Select connection type&lt;/option&gt;
                    &lt;option value="dsl"&gt;DSL&lt;/option&gt;
                    &lt;option value="cable"&gt;Cable&lt;/option&gt;
                    &lt;option value="fibre"&gt;Fibre&lt;/option&gt;
                &lt;/select&gt;
            &lt;/div&gt;
        &lt;/div&gt;
        &lt;div class="location"&gt;
            &lt;label id="location"&gt;Location*:&lt;/label&gt;
            &lt;div class="textwrapper"&gt;
                &lt;select name="location"&gt;
                    &lt;option value=""&gt;Select your location&lt;/option&gt;
                    &lt;option value="home"&gt;At home&lt;/option&gt;
                    &lt;option value="work"&gt;At work&lt;/option&gt;
                &lt;/select&gt;
            &lt;/div&gt;
        &lt;/div&gt;
        &lt;div class="postcode"&gt;
            &lt;label&gt;Postcode:&lt;/label&gt;
            &lt;div class="textwrapper"&gt;
                &lt;input type="text" name="postcodeVal" id="postcodeVal"&gt;
            &lt;/div&gt;
        &lt;/div&gt;
        &lt;div class="start clear"&gt; 
        &lt;input type="button" name="sendToFlash" id="sendToFlash" value="Start Test" onclick="submitCheck();" /&gt;

        &lt;/div&gt;
    &lt;/fieldset&gt;
&lt;/form&gt;

&lt;embed src="/flash/speedtest.swf" id="flashTest" name="flashTest" width="540" height="320" allowscriptaccess="always" type="application/x-shockwave-flash"  flashvars="jsfunc=pushResults&amp;jsfunc2=showExtras" /&gt;
</code></pre>
