Javascript doesn't work when textbox name contains square brackets
<p>I've got this script for calculating square area, which works perfect:</p>

<pre><code>&lt;script language="javascript" type="text/javascript"&gt;
function startCalc(){
  interval = setInterval("calc()",1);
}
function calc(){
  one = document.autoSumForm.firstBox.value;
  two = document.autoSumForm.secondBox.value; 
  document.autoSumForm.Area.value = (one * 1) * (two * 1);
}
function stopCalc(){
  clearInterval(interval);
}
&lt;/script&gt;

&lt;form name="autoSumForm"&gt;
&lt;input  size="3"  type=text name="firstBox" value="" onFocus="startCalc();" onBlur="stopCalc();"&gt;
&lt;input  size="3"  type=text name="secondBox" value="" onFocus="startCalc();" onBlur="stopCalc();"&gt;
&lt;input  size="4"  type=text name="Area" readonly="true"&gt;
&lt;/form&gt;
</code></pre>

<p>But my problem is that I need the name of the third box to be <em><code>Area[&lt;?php echo $area['area_id']; ?&gt;]</code></em></p>

<p>But I can't get the javascript to work, when I use brackets in the name.</p>
