button.click only executed with alert in front

Question

First of all:
This page is for an online pharmacy.
We are using a small script to retrieve some data from insurance companies to ensure that a user actually has an insurance.

On one of our pages we have 2 text-fields and a button. The text field send a .click() to the button to retrieve some information, but only if they are both filled with the right type of data.
This Works.

To enhance the usability of our site we are creating a flow trough different pages. The page previously described is amongst them. I'm sure that the required information is always in the 2 text-fields so I'm using JavaScript to send a .click() to the button. But somehow $('ZK').click(); does not work, but alert(); $('ZK').click(); does.

Is there any one that is able to explain to me why the first is not working and the second is? And perhaps also how I can fix this minor problem?

Is there something with the .click() not having an event or something?

Code inside this page: (not loaded indirectly)

text-field and button:

<INPUT onkeypress="return noenter()"  
       onkeydown="return isNumericKey(event)"  
 TYPE="TEXT"  
 class="ajaxsearch"  
 name="DOB" id="DOB"  
 value="<%=DOB%>"  
 MAXLENGTH="8"  
 style="width:60px;height:18px"  
 onkeyup="javascript:if ($(DOB).get('value').length==8 &&  
                         $(DOB).get('value')!='ddmmjjjj')
 {  
   var myFx=new Fx.Tween($(DOB));  
   myFx.set('color','#000066');  
   $('ZK').click();  
 } else {  
   var myFx=new Fx.Tween($(DOB));  
   myFx.set('color', '#cc0000');  
 };">  `

<INPUT url="?NC=<%=Rnd(Now)%>"  
 TYPE="BUTTON"  
 NAME="ZK" ID="ZK"  
 VALUE="Zoek mij"  
 class="button"  
 style="width:70px;height:22px">

The call script:

  if ($('DOB').get('value').length==8 
      && $('DOB').get('value')!='ddmmjjjj') 
  {
    var myFx=new Fx.Tween($('DOB'));
    myFx.set('color', '#000066');
    //alert();
    $('ZK').click();
   } else {
     var myFx=new Fx.Tween($('DOB'));
     myFx.set('color', '#cc0000');
   }

Ajax script & call:

 <script language="javascript"> 
    window.addEvent('domready', function() { 
      $('ZK').addEvent('click', function(event) { 
        event.stop(); 
        var req = new Request.HTML({ 
          method: 'post', 
          url: '../ajax/a_bsn.asp',
          data: {
            'BSN':$('BSN').get('value'), 
            'DOB':$('DOB').get('value'),
            'RequestType':'WWW',
            'RXID':'<%=GUID%>'
          }, 
          update: $('RES'),
          onRequest: function() {
            $('RES').innerHTML = '<img width="16px" height="16px" src="../images/spinner.gif"/>';
    }}).send(); 
  });

////////
<%  If (Len(BSN)=8 or Len(BSN)=9) and IsNumeric(BSN) and Len(DOB)=8 and IsNumeric(DOB) Then %>
if ($('BSN').get('value').length>7){
  var myFx=new Fx.Tween($('BSN'));
  myFx.set('color', '#000066');
} else {
  var myFx=new Fx.Tween($('BSN'));
  myFx.set('color', '#cc0000');
}
if ($('DOB').get('value').length==8 && $('DOB').get('value')!='ddmmjjjj'){
  var myFx=new Fx.Tween($('DOB'));
  myFx.set('color', '#000066');
  // var $zk = $('ZK'); console.log($zk); $zk.click();
  // alert('Uw gegevens worden ingevuld.');
  setTimeout("$('ZK').click();",1);
  //$('ZK').click();
} else {
  var myFx=new Fx.Tween($('DOB'));
  myFx.set('color', '#cc0000');
}
<%  End If %>
////////
});
</script>

Div affected by Ajax

<DIV id="RES">      
<INPUT TYPE="TEXT" ID="PNAAM" onkeypress="return noenter()"  NAME="PNAAM" VALUE="<%=PNAAM%>" class="text_inv" style="width:375px">
</div>

Answer 1

Our lead-programmer (who originally made the page somewhere around 8 years ago) thought it might be better to move all logic into functions. That way they could be triggered easier in other parts of code if necessary. We also removed all the (old) inline scripts.

In this solution some parts of the other answers were used. I'd like to thank al the other answerers and commenters for their help.

The top part of the code looks like this now (tested and working stable across browsers):

    function updateName(){
        if (document.id('BSN').get('value').length>7 && document.id('DOB').get('value').length==8 && document.id('DOB').get('value')!='ddmmjjjj'){
            var req = new Request.HTML({
                method: 'post',
                url: '../ajax/a_bsn.asp',
                data:{'BSN':document.id('BSN').get('value'),'DOB':document.id('DOB').get('value'),'RequestType':'WWW','RXID':'<%=GUID%>'},
                update: document.id('RES'),
                onRequest: function() {
                    document.id('RES').innerHTML = '<img width="16px" height="16px" src="../images/spinner.gif"/>';
                }
            }).send();
        }
    }
    function checkBSN(){
        if (document.id('BSN').get('value').length>7){
            var myFx=new Fx.Tween(document.id('BSN'));
            myFx.set('color', '#000066');
            updateName();
        } else {
            var myFx=new Fx.Tween(document.id('BSN'));
            myFx.set('color', '#cc0000');
        }
    }
    function checkDOB(){
        if (document.id('DOB').get('value').length==8 && document.id('DOB').get('value')!='ddmmjjjj'){
            var myFx=new Fx.Tween(document.id('DOB'));
            myFx.set('color', '#000066');
            updateName();
        } else {
            var myFx=new Fx.Tween(document.id('DOB'));
            myFx.set('color', '#cc0000');
        }
    }
    window.addEvent('domready', function() {
        document.id('ZK').addEvent('click', function(event) {
            event.stop && event.stop();
            updateName();
        });
        document.id('BSN').addEvent('keyup', function(event) {
            event.stop && event.stop();
            updateName();
        });
        document.id('DOB').addEvent('keyup', function(event) {
            event.stop && event.stop();
            updateName();
        });
    <%  If (Len(BSN)=8 or Len(BSN)=9) and IsNumeric(BSN) and Len(DOB)=8 and IsNumeric(DOB) Then %>
        updateName();
    <%  End If %>
    });