Text entered into Webpage Search Box via Excel VBA is not detected when clicking Search button

Question

I'm having trouble when trying to click a search button on a webpage via Excel VBA. Actually, my real issue has to deal with the particular webpage not seeing that I entered something in the search box. After I click the search button on the webpage I get the message saying "Provide a number or company name to search" when there's already something in the search box.

Before the Text is entered into the Search Box:

After the Text is entered into the Search Box & the Search button is clicked:

Here's the portion of the HTML source where the button (and onclick event) is present. The specific line for the button is <a href="#" class="add-on" data-bind="click: performSupplierSearch"><i class="icon-search">

 <div class="row-fluid">
        <div class="span6">
            <h4>Search for the supplier you wish to Log in as:</h4>
            <span class="helpText-SearchSupplier">Search by name or number</span>
        </div>
    </div>

    <div class="row-fluid block">
        <div class="span4 input-append pull-left">
            <input id="supplierSearchTextBox" data-bind="value: searchQuery, valueUpdate: 'afterkeydown', onEnter: performSupplierSearch" type="text" class="input-xlarge" autocomplete="off" placeholder="Search Suppliers" />
            <a href="#" class="add-on" data-bind="click: performSupplierSearch"><i class="icon-search"></i></a>
        </div>
    </div>
    <div class="row-fluid" data-bind="visible: searched() && supplierSearchResults().length == 0">
        <div class="span12">
            <div class="alert ">
                <strong><i class="icon-warning-sign"></i> 0 results returned </strong>                
            </div>
        </div>
    </div>
    <div class="row-fluid" data-bind="visible: (searchMessage().length > 0)">
        <div class="span12">
            <div class="alert ">
                <strong><i class="icon-warning-sign"></i><span data-bind="text: searchMessage"></span></strong>                
            </div>
        </div>
    </div>

When I inspect the elements of the HTML and click on the Search button it invokes y.handle, which I followed to a jquery file and found these two code snippets that mention said y

(p=y.events)||(p=y.events={})

amidst this function in the jquery file

add:function(n,r,u,f,e){var b,p,k,w,c,l,a,v,h,d,g,y=i._data(n);if(y){for(u.handler&&(w=u,u=w.handler,e=w.selector),u.guid||(u.guid=i.guid++),(p=y.events)||(p=y.events={}),(l=y.handle)||(l=y.handle=function(n){return typeof i===o||n&&i.event.triggered===n.type?t:i.event.dispatch.apply(l.elem,arguments)},l.elem=n),r=(r||"").match(s)||[""],k=r.length;k--;)b=sr.exec(r[k])||[],h=g=b[1],d=(b[2]||"").split(".").sort(),c=i.event.special[h]||{},h=(e?c.delegateType:c.bindType)||h,c=i.event.special[h]||{},a=i.extend({type:h,origType:g,data:f,handler:u,guid:u.guid,selector:e,needsContext:e&&i.expr.match.needsContext.test(e),namespace:d.join(".")},w),(v=p[h])||(v=p[h]=[],v.delegateCount=0,c.setup&&c.setup.call(n,f,d,l)!==!1||(n.addEventListener?n.addEventListener(h,l,!1):n.attachEvent&&n.attachEvent("on"+h,l))),c.add&&(c.add.call(n,a),a.handler.guid||(a.handler.guid=u.guid)),e?v.splice(v.delegateCount++,0,a):v.push(a),i.event.global[h]=!0;n=null}},remove:function(n,t,r,u,f)

I don't know if the jquery code will help at all, but I figure it couldn't hurt to give as much information as I could to increase the odds of at least one person being able to help me resolve this.

Here is the portion of my code where I'm attempting to enter the text and click the button

'Select Search Box
IE.document.GetElementByID("supplierSearchTextBox").Focus

'Fill in Search Box
IE.document.GetElementByID("supplierSearchTextBox").Value = "Test"

delay 3
'Click Search button
Dim searchButton As Object
'6th a tag so index 5
Set searchButton = IE.document.GetElementsByTagName("a")(5)
searchButton.Click

Am I entering the Value in the wrong way/with the wrong method or does it have something to do with the onclick event that's attached to the search button that is the problem? How can I get the code to work correctly?

Answer 1

After hours of searching, scouring over each section of code, and much digging around countless forums I finally found a solution that may help others in the future. I realized that my issue has to deal with the way the value/textbox updates (using the valueUpdate: 'afterkeydown', which means the code is looking for actual keypress events, which is why it wouldn't see the string when I inserted it into the text field via the vba code. Since I discovered that .fireEvent() doesn't work on newer versions of Internet Explorer, I felt like all was lost and that I would have to revert to the unreliable Sendkeys() method that everyone says to avoid. But, just before I was about to give up for the night I came across this little gem where user dyanisis2 provides this method after their long search for the same issue yielded this solution

Set evt = ie.Document.createEvent("keyboardevent")
    evt.initEvent "change", True, False
    PW.all(0).dispatchEvent evt

Replace PW with your object.

Placing this bit of code after entering a value into the field that needs to detect a keypress will simulate a keypress event, therefore updating the value in the text field and allowing the code to recognize that there is something in the field.

Answer 2

Just want to confirm this worked for me. just replaced PW.all.(0) at the last line.

IE.Document.forms(0).getElementsByTagName("select")(1).dispatchEvent evt