html - My JavaScript works as inline code but not as an include file. Any ideas why and how to fix it? -

i have form:

<form id="searchform" class="search_field" method="get" action=""> ... ... </form> 

then javascript:

    var form = document.getelementbyid("searchform");     form.dosearch1.onclick = searchpage;     form.dosearch2.onclick = searchpage;     form.showfeaturechoices.onclick = function( )         {             var cbs = form.feattype;             ( var c = 0; c < cbs.length; ++c )             {                 cbs[c].checked = false;             }             document.getelementbyid("featuresdiv").style.display = "block";         }  function searchpage() {     var form = document.getelementbyid("searchform");     var searchtext = form.searchbox.value.replace(/-/g,"");     form.searchbox.value = searchtext;      if (searchtext != "")      {         // collect features search for:         var features = [ ];         var feattypes = form.feattype;         ( var f = 0; f < feattypes.length; ++f )         {             if ( feattypes[f].checked ) features.push( feattypes[f].value );         }         featurelist = "'" + features.join("','") + "'";          searchmsg("searching '" + searchtext + "' ...");         // startstatusupdate(1000);         // findtask.execute(findparams, showresults);         var accord = dijit.byid("accordiancontainer");         var resultspane = dijit.byid("resultspane");         accord.selectchild(resultspane,true);          dosearch( searchtext, featurelist );     }     else     {       searchmsg("no search criteria entered, enter search text");     }    } 

if embed code in same file <form..., works fine.

if however, have js in file , use include file:

<script type="text/javascript" src="views/js/main.js"></script> 

i following error: "object required" , points these lines:

form.dosearch1.onclick = searchpage; form.dosearch2.onclick = searchpage; 

any ideas how fix this?

just bit more info, js code shown above in file called main.js in folder called js , js in folder called views.

thanks lot in advance

when include javascript code in same page, in relation form element? (before or after it?) how when reference external javascript file?

i'm guessing in former case code @ end of file, while in latter case script reference tag @ beginning?

if that's true what's happening code being executed before dom ready:

var form = document.getelementbyid("searchform"); form.dosearch1.onclick = searchpage; form.dosearch2.onclick = searchpage; 

if form tag hasn't been rendered dom yet first line won't find anything, , subsequent lines fail result. 1 approach put script reference tags @ end, seems hack me. there reasons keep them in page header, not least of cleaner management of code in many cases. there other ways hold off on executing javascript code until dom ready.