I'm working on a visualforce page to streamline data entry for my organization.  I find I need to do some client-side javascript validations.  I'm capturing data that I then use to create 4 related objects at once.  The page has a controller extension, so the object related to that controller extension gets its normal validations.  Failure is uglier if required data on the other objects isn't provided, so I'd like to head that off by making sure certain fields are filled in.

I've tried a few different ways of doing this, but not met with much success.  I think my problem is figuring out how to get a page element's ID via $component.  It seems like there should be an easier way to get an element's ID, but that the method I've found referenced here.  Can you point me toward good working examples of client-side validation or reliable way to get the ID of an element in a page?

The examples I've found here have a very simple page structure.  I'd like to figure out the correct $component... reference to LastNameFld in the code below.  Any suggestions are welcome.  Do any of you use some tool like Firebug to help unravel the code?

<apex:page standardController="Contact" extensions="FastContactEntryPageController">   
    <apex:form >       
        <apex:pageBlock title="Fast Contact Entry" mode="edit" id="FCEMainBlock" >
            <apex:outputPanel id="panelMsg">
                <apex:pagemessages ></apex:pagemessages>  
            </apex:outputPanel>
            
            <apex:outputPanel id="InputSec">                      
            <apex:pageBlockSection title="Scholar Contact" id="sc1" columns="2">
            <apex:pageBlockSectionItem >
            <apex:commandButton value="Save" id="theSaveButton"  onclick="validation();"/><p/>

            </apex:pageBlockSectionItem>
            <apex:pageBlockSectionItem >
            <apex:commandButton action="{!Cancel}" value="Cancel" id="theCancelButton"/><p/>
            </apex:pageBlockSectionItem>                          
            
            <apex:pageBlockSectionItem >
             Scholar First Name:<apex:inputField value="{!contact.FirstName}"/>
             </apex:pageBlockSectionItem>
                          
             <apex:pageBlockSectionItem id="lnsec">
             Scholar Last Name:<apex:inputField id="LastNameFld" value="{!contact.LastName}" />                          
             </apex:pageBlockSectionItem>