CODEWITHSUNDEEP
excelvbainternet-explorerkendo-grid
Mitch
Mitch

Reputation: 583

Trying to select an item in kendogrid kendoDropDownList using Excel VBA

I'm trying to select an item on a dropdown list on an internal company web page. I am able to set text entry items and get the dropdownlist to open, but I' having a hard time figuring out how to make a selection

In other area I'm able to make a selection using the ID and td/tr tags, but this routine doesn't have any tr/td tags with entry names.

Here'a couple of things I've tried so far:

These two items perform the same function and work fine for opening the first dropdown

ie.Document.getElementById("FromDistrict").Click
ie.Document.parentWindow.execScript "$('#FromDistrict').kendoDropDownList('open');"

I've tried several variations of these:

  ie.Document.parentWindow.execScript "$('#FromDistrict').data('kendoGrid').dataItem($('transport').data('kendoDropDownList').select('KILGORE'));"
  ie.Document.parentWindow.execScript "$('#FromDistrict').data('kendoGrid').data('kendoDropDownList').select('KILGORE'));"
  ie.Document.parentWindow.execScript "$('#FromDistrict').data('kendoGrid').data('kendoDropDownList').select('eq:0'));"
  ie.Document.parentWindow.execScript "$('#FromDistrict').data('kendoDropDownList').select('KILGORE'));"
  ie.Document.parentWindow.execScript "$('#FromDistrict').select('KILGORE'));"

Viewing the source code for this particular segment is:

</div>
<form action="/TransferLoad/Add" method="post"><input name="__RequestVerificationToken"  _ 
type="hidden" value="IP80d5XM-Qi0XQ1-IgGKGmhLVNGdtDAyM-r7lJ6yQCI1RIdJJph0uPnz-DzEHx12_booO4xwvcWg6EUWPiLnHv7ww6PD-aqfhiVxPcy-VYm6mnBRHsba3H7Hembliybo0" />  _ 
  <div class="k-block k-info-colored">
    <div class="k-header">
        <span>Add Transfer Load Details</span>
    </div>
    <div class="k-content">
        <div class="infocontainer">
            <table>
                <tr>
                    <td class="columnLabel">
                        <label for="From_District:">From District:</label>
                    </td>
                    <td class="columnData">
                        <input id="FromDistrict" name="FromDistrict" style="width: 200px" type="text" />
 <script>
  jQuery(function(){jQuery("#FromDistrict").kendoDropDownList({"dataSource" _ 
 :{"transport":{"read": {"url":"/DistrictProfiles/GetUserDistricts","data": _ 
 function() { return kendo.ui.DropDownList.requestData(jQuery("#FromDistrict"));  }}, _ 
 "prefix":""}, "serverFiltering":true,"filter":[],"error":OnError, _ 
 "schema": {"errors":"Errors"}},  "dataTextField":"DistrictName","autoBind":true, _ 
 "dataValueField":"DistrictCode", "optionLabel":"Select District..."});});
</script>
                    </td>
                    <td class="columnLabel">    'Next dropdown section starts here
                        <label for="To_District:">To District:</label>
                    </td>

When the dropdown opens, it has 2 items to choose from, but nowhere in the code can I find those 2 items listed, so I'm assuming they're pulled from this line: return kendo.ui.DropDownList.requestData(jQuery("#FromDistrict")) , but I'm not sure. Can someone point out what I'm missing here ?

I did not post the "view element" because of the difficulty in copying it. All selections dynamically change other selection options.

Upvotes: 0

Views: 336

Answers (2)

Mitch
Mitch

Reputation: 583

I was able to accomplish what I wanted in a crude sort of way by using the following, but I'm working on a better more efficient way.

'Choose the FROM district
ie.Document.parentWindow.execScript "$('#FromDistrict').kendoDropDownList('open');"
Dim FrDist, li
Set FrDist = ie.Document.getElementById("FromDistrict-list").getElementsByTagName("li")
    Dim fd
    fd = 0
    For Each li In FrDist
        'MsgBox ("li.innertext is -   " & li.innerText & " fd value is: " & fd)
        If li.innerText Like "*KILGORE*" Then
           FrDist(fd).Click
         Else
         'Do Nothing
       End If
        fd = fd + 1
        'Application.Wait (Now + TimeValue("0:00:02"))
    Next

Application.Wait (Now + TimeValue("0:00:02"))

'Choose the TO district
ie.Document.parentWindow.execScript "$('#ToDistrict').kendoDropDownList('open');"
Dim ToDist
Set ToDist = ie.Document.getElementById("ToDistrict-list").getElementsByTagName("li")
    Dim tod
    tod = 0
    For Each li In ToDist
        'MsgBox ("li.innertext is -   " & li.innerText & " tod value is: " & tod)
        If li.innerText Like "*KILGORE*" Then
           ToDist(tod).Click
         Else
            'Do Nothing
       End If
        tod = tod + 1

    Next

Upvotes: 0

Rob Parsons
Rob Parsons

Reputation: 839

IN the browser DOM explorer (which shows the markup 'computed/sanitized' by the rendering engine) you should see that

<input id="FromDistrict" name="FromDistrict" style="width: 200px" type="text" />

has been changed to include the datalist attribute. eg.

<input id="FromDistrict" name="FromDistrict" style="width: 200px" type="text" datalist="DistrictName" />

..... and further down the DOM, you should see the datalist element that has been injected into the DOM by the Kendo code.

<datalist id="DistrictName">
<option value="Kent">Kent</option>
<option value="Surry">Surry</option>
</datalist>

You should be able to automate the field, by just assigning a valid comma-separated list to the FromDistrict.

eg. FromDistrict.value='Kent, Surry';

Upvotes: 1

Related Questions