Wait for Javascript to populate combobox

Question

I'm trying to populate a web page (opened in a twebbrowser in delphi xe5). It has two combo boxes. The seconded is based on the first. So the choices in the second combo box only get populated when you fill in the first one.

My Problem is that in the first ComboBox I am able to select the correct value, but when I try to select the second one, it does not get selected, it keeps the default value.

Here is the HTML for the first combo box

<span class="body-textm-blue-bold" style="margin-top:5px;">
    <SELECT ID='lstComp' NAME='COMP' VALUE='1' old_value='1' CLASS='' STYLE=''   onChange=' ChangeOldValue(this);' onClick='' onBlur='' onFocus='' onKeyPress='checkEnter(event)' >
    <OPTION VALUE='1' ADD1='' SELECTED>1 - Company 1</OPTION>
    <OPTION VALUE='2' ADD1=''>2 - Company 2</OPTION>
    <OPTION VALUE='6' ADD1=''>6 - Company 6</OPTION></SELECT>
</span>

and the second is similar, but changes based on what I choose here.

The onChange function basically calls doAJAXCallClientSelection.

Here is doAJAXCallClientSelection:

function doAJAXCallClientSelection() {


        poststr = "COMP=" + escape( document.getElementById("lstComp").value ) + 
            "&TITL=" + escape( document.getElementById("lstTitle").value );


    poststr = poststr +  
                "&ST=" + escape( document.getElementById("lstState").value ) +
                "&PR=" + escape( document.getElementById("lstProductType").value ) +
                "&AG=" + escape( document.getElementById("txtTitle").value ) +
                "&PT=" + escape( document.getElementById("lstTypeOfTerm").value ) +
                "&DT=" + escape( document.getElementById("txtEffectiveDate").value ) +
                "&Page From=" + escape( document.getElementById("pageFrom").value); 

    var xmlhttp = null;
    if (window.XMLHttpRequest)  { 
        xmlhttp=new XMLHttpRequest();
        xmlhttp.open("POST", 'refreshCompanyTitleSel', true);
        xmlhttp.setRequestHeader("Content-type", "application/x-www-form-urlencoded");
        xmlhttp.setRequestHeader("Content-length", poststr.length);
        xmlhttp.setRequestHeader("Connection", "close"); 
    } 


    xmlhttp.send(poststr);

    xmlhttp.onreadystatechange=function() { 
        if (xmlhttp.readyState==4) { 
            if(xmlhttp.status==200) { 
                var res = xmlhttp.responseText; 
                fld = eval(document.getElementById('search'));
                if (fld) {                      
                    res = res.replace("VALUE='*' old_value='*'","VALUE='1' old_value='1'");
                    res = res.replace("<OPTION VALUE='x' ADD1='' SELECTED>All Companies </OPTION>"," ");
                    res = res.replace("<OPTION VALUE='x' ADD1=''>All Companies </OPTION>"," ");
                    res = res.replace("<OPTION VALUE='xxx' ADD1=''>All Titles </OPTION>"," ");
                    res = res.replace("<OPTION VALUE='xxx' ADD1='' SELECTED>All Title </OPTION>"," ");
                    fld.innerHTML="";
                    fld.innerHTML=trim(res);
                }
            } 
        }    
    } 
}

I notice it does a Post (
xmlhttp.open("POST", 'refreshCompanyTitleSel', true);

) But my onDocumentComplete does not get called.

Can this be causing my problem?

Here is my onDocumentchange:

if URL = 'https://www.xxx.xx/xxxxxxxxInquiry' then
begin
 doc := getFrame(WebBrowser1);
 if not Assigned(Doc) then
  Exit;
 FireEvent(doc,'lstComp','onchange','2');
 FireEvent(doc,'lstTitle','onchange','25');
End;

Here is the FireEvent procedure:

procedure TForm1.FireEvent(doc: IHTMLDocument2;ID,event, value: String);
var
  v: OleVariant;
  doc3: IHTMLDocument3;
  el: IHTMLElement;
begin
  if doc.QueryInterface(IHTMLDocument3, doc3) = S_OK then
  begin
    el := doc3.getElementById(ID);
    if el <> nil then
    begin
     (el as IHTMLSelectElement).value := value;
     (el as IHTMLElement3).FireEvent(event, v);
    end;
  end;
end;

Which I got from this site. It works perfectly, it sets the correct value in the combo box 1

When I fire the second combo box:

FireEvent(doc,'lstTitle','onchange','25');

it does not update the second combo box with the correct value, it just remains with the default value.

The fire events are called in WebBrowser1DocumentComplete.

I tried filling only the first combo box, and then with a button I load the second combo box, and that works, it sets the right value in combo box 2.

It seems that I'm calling the second fire event before the first is finished loading the second combo box. Is there anyway to wait for it to be populated? I checked and it does not call WebBrowser1DocumentComplete again.

I also tried adding

while WebBrowser1.ReadyState <> READYSTATE_COMPLETE do
  Application.ProcessMessages;

after the first call, but no change.