title: Filling HTML Input Boxes That Were Created With Select2
body: <p>I'm using Excel VBA to automate a web page.  The "Select" boxes and "Input" boxes were created by a jQuery platform called "Select2."</p>
  
  <p>When the user clicks on a "Select box" (which appears as an input box) a dropdown box pops up asking the user to type in two characters.  I've discovered that you can add a valid data item into this box with this command by inserting the select box ID.</p>
  
  <pre><code>myDoc.parentWindow.execScript "$('#s2id_broomCloset').val('Swiffer - Model 2010').trigger('change')"
  </code></pre>
  
  <p>Most of the input boxes are like any other where you can change them with </p>
  
  <pre><code>myDoc.GetElementByID("broomCloset").value = "Swiffer"
  </code></pre>
  
  <p>However, there is one input box built with Select2 which involves a validation drop down list asking the user to type the first two characters and it lists employees whose last names start with those two characters.  Then the user is supposed to select the employee from the list.</p>
  
  <p>This input box is tied to an "
  
  <p><a href="https://i.stack.imgur.com/8JCqY.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/8JCqY.png" alt="enter image description here"></a></p>
  
  <p>I was able to use the advice of </p>
  
  <p>I have tried everything I can think of to enter a valid response into this input box.  Here are a couple of failed attempts:</p>
  
  <pre><code>myDoc.GetElementByID("s2id_beanCounter").Children(0).Clicik
  myDoc.parentWindow.execScript "$('#s2id_beanCounter').trigger('onclick')"
  </code></pre>
  
  <p>It would be a tremendous help if you could lead me to an answer as how can I put a valid input into this box or at least how to click the box to make the drop down list appear.</p>
  
  <p>Edited 06-20-2017</p>
  
  <p>Using advice from @dee I was able to get the last name into the searchable input elelment and it drops down all of the people with that last name.  As you can see from the html code below the first name in the drop down box is highlighted.</p>
  
  <p>When I hover the mouse over any of the names, the name under the mouse becomes the highlighted name.  And of course a left click of the mouse enters that name into the input box.</p>
  
  <p>How can I automate the process of highlighting the name we need form the UL list and click it to put into the input box as a valid value?</p>
  
  <p>The one caveat about this search is that it only searches the last name.  </p>
  
  <pre><code>&lt;div class="select2-drop select2-display-none bigdrop select2-with-searchbox select2-drop-active" id="select2-drop" style="left: 1049.13px; top: 227.83px; width: 238px; display: block;"&gt;   
    &lt;div class="select2-search"&gt;       
        &lt;input class="select2-input" spellcheck="false" type="text" autocomplete="off" autocapitalize="off" autocorrect="off"&gt;   
   &lt;/div&gt;   
  
    &lt;ul class="select2-results"&gt;
        &lt;li class="select2-results-dept-0 select2-result select2-result-selectable select2-highlighted"&gt;
            &lt;div class="select2-result-label"&gt;
                &lt;div&gt;JOSEPH MENGELA (ARGENTINA)&lt;/div&gt;&lt;/div&gt;
        &lt;/li&gt;
  
        &lt;li class="select2-results-dept-0 select2-result select2-result-selectable"&gt;
            &lt;div class="select2-result-label"&gt;
                &lt;div&gt;TOMMY MENGELA (ITALY)&lt;/div&gt;
            &lt;/div&gt;
        &lt;/li&gt;
  
        &lt;li class="select2-results-dept-0 select2-result select2-result-selectable"&gt;
            &lt;div class="select2-result-label"&gt;
                &lt;div&gt;SUSAN H MENGELA (POLAND)&lt;/div&gt;
            &lt;/div&gt;
        &lt;/li&gt;
     &lt;/ul&gt;
  &lt;/div&gt;
  </code></pre>
  
  <p>Here is the code I used to get the dropdown box to show all the names of people in our system with that last name.</p>
  
  <pre><code>Set myElement = myDoc.getElementById("s2id_IDofInputBoxHere").Children(0)
  SendMouseDownEvent myDoc, myElement
  Set myElement = myDoc.getElementById("select2-drop").Children(0).Children(0)
  myDoc.getElementById("select2-drop").Children(0).Children(0).Value = "mengela"
  ' Send input event to trigger searching of text 'BR"
  Dim kev
  Set kev = myDoc.createEvent("KeyboardEvent")
  kev.initEvent "input", True, False
  myElement.dispatchEvent kev
  </code></pre>