I've set up a cross browser ajax submission function that receives two parameters, a task name and a "this" reference to the html object that called the function.

submitbutton_ajax('taskName', this);

I've created two tasks. One of them is for a drop-down listbox that populates with links retrieved from the database. It then loops through the links and assigns a function to the onclick event of each one as below.

Code:
for(i=0; i < elem_links_ref.length; i++) {
   elem_links_ref[i].onclick = function(event) {
      submitbutton_ajax('selectOption', this);
   }
}
The drop-down listbox works, but I'm having trouble with the retrieved links. When I click on a link it manages to call the submitbutton_ajax function, but it fails to send a post request to the server. It sort of works when I insert the green segment of code at the bottom, but obviously not what I want.

Why is the xml http request failing to send unless I do this?


Code:
submitbutton_ajax('task_name', element_reference) {

// CODE GOES HERE FOR CREATING THE CROSS BROWSER XML HTTP REQUEST OBJECT CALLED "myRequest"
// AS WELL AS SETTING OTHER PARAMETERS BASED ON THE TASK BEING CALLED


// SET THE ONREADYSTATECHANGE EVENT

myRequest.onreadystatechange = function() {
   if(myRequest.readyState == 4) {
      if(myRequest.status == 200)
      {

         // POPULATE DROPDOWN LIST WITH LINKS //

         if(task == 'togglePopups') {
            elem_child_ref = elem_ref.getElementsByTagName('div');
            elem_child_ref[0].innerHTML = myRequest.responseText;
            elem_links_ref = elem_child_ref[0].getElementsByTagName('a');

            for(i=0; i < elem_links_ref.length; i++) {
               elem_links_ref[i].onclick = function(event) {
                  submitbutton_ajax('selectOption', this);
               }
            }

            elem_ref.className = 's_pullup';
            elem_child_ref[0].style.display = 'block';					
         }

         // CODE TO EXECUTE WHEN ONE OF THE LINKS ARE CLICKED
         // THIS CODE FAILS TO EXECUTE

         if(task == 'selectOption')
         {
            alert('toggled');
         }
      }
      else
      {
         alert('There was a problem with the request');
      }
   }

   // HOWEVER IT DOES WORK (SORT OF) WHEN I INSERT THIS CODE

   else {
      alert('AJAX IS MESSING UP AGAIN!');
   }

   // IT DISPLAYS THE "AJAX MESSING UP" MESSAGE SEVERAL TIMES
   // BUT EVENTUALLY ALSO DISPLAYS THE "TOGGLED" ALERT MESSAGE
}

   // SEND REQUEST

   myRequest.open('POST', url, true);
   myRequest.setRequestHeader("Content-type", "application/x-www-form-urlencoded");
   myRequest.setRequestHeader("Content-length", params.length);
   myRequest.setRequestHeader("Connection", "close");
   myRequest.send(params);
}