Help with hiding div tags based on radio selection

[bowlinbd]

I am new to JavaScript and realize that I'm probably just missing something simple. I have two radio buttons and I want a a certain div tag to display based on which button is selected. I've cut out the extra coding and made a very basic example of what I'm trying to do. If you could be of any help I would greatly appreciate it.

The error that I'm getting is stating that "document.form.techspecsub" is either null or not an object.

<script type="text/javascript">

function showhide_areabldgreq() 
{
   if (document.form.techspecsub[0].checked) 
      {
      document.getElementById("areabldg").style.display = "inline";
      }
   else 
      { 
      document.getElementById("areabldg").style.display = "none";
      } 

   if (document.form.techspecsub[1].checked) 
      {
      document.getElementById("reqpo").style.display = "inline";
      }
   else 
      { 
      document.getElementById("reqpo").style.display = "none";
      } 
}

</script>



<form>
<input name="techspecsub" value="Enter Area" type="radio" 
onClick="showhide_areabldgreq()" />Enter Area<br>

<input name="techspecsub" value="Enter Requisition" type="radio" 
onClick="showhide_areabldgreq()"  />Enter Requisition
</form>

<div id="areabldg" style="display:none">I'm Area</div><br>
<div id="reqpo" style="display:none">I'm Req PO</div>

[rangana]

Add highlighted:

   if (document.forms[0].techspecsub[0].checked) 
      {
      document.getElementById("areabldg").style.display = "inline";
      }
   else 
      { 
      document.getElementById("areabldg").style.display = "none";
      } 

   if (document.forms[0].techspecsub[1].checked) 
      {
      document.getElementById("reqpo").style.display = "inline";
      }
   else 
      { 
      document.getElementById("reqpo").style.display = "none";
      }

Hope that helps.

[uncrocks]

Set the radio buttons to have values and change one of their names...

<input type="radio" value="YOURVALUE" name="techspecsub"><input type="radio" value="YOURVALUE" name="techspecsubb">

Then change Your javascript to check for the value...

<script type="text/javascript">

function showhide_areabldgreq() 
{
   if (document.form.techspecsub.value="YOURVALUE") 
      {
      document.getElementById("areabldg").style.display = "inline";
      }
   else 
      { 
      document.getElementById("areabldg").style.display = "none";
      } 

   if (document.form.techspecsubb.value="YOURVALUE") 
      {
      document.getElementById("reqpo").style.display = "inline";
      }
   else 
      { 
      document.getElementById("reqpo").style.display = "none";
      } 
}

</script>

That Should Work

[bowlinbd]

Both solutions worked perfectly. Thank you very much.