TechQA.

VBA HTML Add Input Element to Span

311 views Asked by At

Original information:

I am trying to work with an internet explorer session using VBA.

The HTML of the website adds input check boxes using some background procedure when a div element is clicked, rather than a native input checkbox. When fired, the background process adds an input element to a span at the bottom of a form. Because I cannot directly interact with the psuedo-checkbox div element and get the process to fire using .click, I am trying to add what I know will be the resulting input elements to the span at the bottom of the form.

Example HTML:

span id="checkboxesFor_wt.epm.EPMDocument.defaultSearchView" style="visible"
    input type="checkbox" checked="true" id="search$search$$|search$executeSearch$$|search$search$$VR:wt.epm.EPMDocument:6927561181!*" name="pjl_selPJLsa1__1" value="search$search$$|search$executeSearch$$|search$search$$VR:wt.epm.EPMDocument:6927561181!*"
    input type="checkbox" checked="true" id="search$search$$|search$executeSearch$$|search$search$$VR:wt.epm.EPMDocument:6927577196!*" name="pjl_selPJLsa1__1" value="search$search$$|search$executeSearch$$|search$search$$VR:wt.epm.EPMDocument:6927577196!*"
    input type="checkbox" checked="true" id="search$search$$|search$executeSearch$$|search$search$$VR:wt.epm.EPMDocument:6822696098!*" name="pjl_selPJLsa1__1" value="search$search$$|search$executeSearch$$|search$search$$VR:wt.epm.EPMDocument:6822696098!*"
/span

I believe that I need to use the .appendChild() on the span but I have not been able to make any progress in this aspect. Everything for iterating through the rest of the page and grabbing information needed to set the input element is good to go. I just need to add the input element to the span somehow.

Added Information

VBA:

Dim ie_PTC_session As InternetExplorerMedium
Set ie_PTC_session = establish_ie_session_ref("url")

Dim html_DOC As HTMLDocument 'the HTML web page
Set html_DOC = ie_PTC_session.Document

If ie_PTC_session Is Nothing Then
    MsgBox "Please open the corrent Internet Explorer Session."
    Exit Sub
End If

'Initialize reference to the search field and input the desired search values
Dim global_search_field As HTMLInputElement
Set global_search_field = html_DOC.getElementById("gloabalSearchField")
global_search_field.Value = "search_vals"

'Initialize the search button and perform the search by clicking the image element
Dim search_button As HTMLImg ' the search button next to the global search field
Dim img_ele As HTMLImg

For Each img_ele In html_DOC.getElementsByTagName("IMG")
    If img_ele.ClassName = "x-form-trigger global-search-trigger" Then
        Set search_button = html_DOC.getElementById(img_ele.ID)
    End If
Next img_ele

Set search_button = html_DOC.getElementById(search_button_id)
search_button.Click

Application.Wait (Now + TimeValue("0:00:05")) 'I know, do while is busy; just hasnt been working out
'probably do while hasnt found the a specfic element, probably mainform and with a timeout process
Dim mainform As HTMLFontElement
Set mainform = html_DOC.getElementById("mainform")

'Initialize and set the search_row_table html div element
Dim search_result_table As HTMLDivElement
Set search_result_table = html_DOC.getElementById("table__wt.epm.EPMDocument.defaultSearchView_TABLE")

'Initialie the span including the hidden input check boxes created by the div clicks
Dim checked_results As HTMLSpanElement
Set checked_results = html_DOC.getElementById("checkboxesFor_wt.epm.EPMDocument.defaultSearchView")

'Initialize and set a new html document. the purpose of this document is to serve as a building/manipulation
'area before they are appeneded as children to the span which controls the items added to a users workspace
Dim html_doc_m As HTMLDocument
Set html_doc_m = New HTMLDocument

Dim result_icheckbox As HTMLInputElement 'input element that is manipulated and added to the checked_results span element
Set result_icheckbox = html_doc_m.createElement("INPUT")

result_icheckbox.Name = "id_value"
result_icheckbox.Type = "checkbox"
result_icheckbox.Checked = True

'Initialize and set constants needed to build checkbox values
Dim ricb_id_prefix, ricb_suffix As String
ricb_id_prefix = "url+some": ricb_id_suffix = "!*"

'Initialize the elements needed to iterate through
Dim srt_div As HTMLDivElement 'rows of search results
Dim row_div As HTMLDivElement 'row colomn divs
Dim anchor As HTMLAnchorElement 'column anchor elements

Dim i, j As Integer: i = 0: j = 0 'Append information origin Top to Bottom, Left to Right
Dim href_m As String 'manipulated href attribute from anchor element

For Each srt_div In search_result_table.getElementsByTagName("div")
    If IsNumeric(srt_div.getAttribute("RowIndex")) Then
        For Each row_div In srt_div.getElementsByTagName("div")
            If row_div.ClassName = "x-grid3-row-checker" Then
                row_div.Click 'I click every single "checkbox" that is actually a div element.
                'nothing happens at for these actions. not a thing.
            End If

            If row_div.ClassName = "x-grid3-cell-inner x-grid3-col-name" Then
                'Debug.Print row_div.innerText
            End If

            If row_div.ClassName = "x-grid3-cell-inner x-grid3-col-number" Then
                For Each anchor In row_div.getElementsByTagName("a")

                    'Debug.Print anchor.getAttribute("ext:qtip") 'windchill F Number
                    href_m = anchor.getAttribute("href")
                    href_m = Right(href_m, Len(href_m) - 93) '93 is the preceding host location. this probably needs to be more dynamic
                    href_m = Left(href_m, Len(href_m) - 5) '5 trailing characters, should probably be more dynamic as well
                    result_icheckbox.ID = ricb_id_prefix & href_m & ricb_id_suffix
                    result_icheckbox.Value = result_icheckbox.ID

                    'This is the point where all of the needed input information has been set and I need to add the
                    'input element to the span. I cannot get this to work. Do I need to create a second HTML Doc, add the span,
                    'and replace the original in the browser as per one of the comments?
                    checked_results.appendchild (results_icheckbox)
                    'appendchild takes an "IHTMLDOMNode, maybe I need to create a DOMNode span use it to replace the current span?

                Next anchor
            End If
        Next row_div
    End If
Next srt_div

Set everything = Nothing 'Remove some lines for ease of question viewing

HTML: 

<FORM name=mainform id=mainform action=""; method=post>
 <DIV class="searchPage" form=[object]>
  <!--CONTENT_AREA-->
  <DIV id=searchResultTableDiv>
   <SCRIPT language=javascript>
      //javascript object for search results
     resultParams = new SearchResultsJSParams();
     resultParams.searchResultsViewId = 'wt.epm.EPMDocument.defaultSearchView';
     resultParams.webappName = '';
     resultParams.quickSearch = false;
     Ext.ComponentMgr.onAvailable('wt.epm.EPMDocument.defaultSearchView', PTC.search.addSearchResultsTableListeners);
   </SCRIPT>
   <INPUT name=mvcFlag type=hidden value=null>
   <DIV class=frame_outer id=table__wt.epm.EPMDocument.defaultSearchView_TABLE>
    <DIV class=" x-panel x-panel-noborder x-grid-panel" id=wt.epm.EPMDocument.defaultSearchView style="WIDTH: auto">
     <DIV class=x-panel-bwrap id=ext-gen1803>
      <DIV class="x-panel-body x-panel-body-noheader x-panel-body-noborder" id=ext-gen1805 style="HEIGHT: 116px; WIDTH: auto">
       <DIV class=x-grid3 id=ext-gen1810 style="HEIGHT: 116px" hideFocus>
        <DIV class=x-grid3-viewport id=ext-gen1811>
         <DIV class=x-grid3-header id=ext-gen1812>
          <DIV class=x-grid3-header-inner id=ext-gen1818>
           <DIV class=x-grid3-header-offset style="WIDTH: 1394px">
            <TABLE style="WIDTH: 1375px" border=0 cellSpacing=0 cellPadding=0>
             <THEAD>
              <TR class=x-grid3-hd-row>
              <TD class="x-grid3-hd x-grid3-cell x-grid3-td-checker x-grid3-cell-first" style="WIDTH: 18px">
              <DIV class="x-grid3-hd-inner x-grid3-hd-checker" unselectable="on"><A class=x-grid3-hd-btn id=checker href="#"></A>
              <DIV class=x-grid3-hd-checker ext:qtip="Select all rows">&nbsp;</DIV><IMG class=x-grid3-sort-icon src=""></DIV></TD>
              <TD class="x-grid3-hd x-grid3-cell x-grid3-td-statusFamily_General" style="WIDTH: 30px">
              <DIV class="x-grid3-hd-inner x-grid3-hd-statusFamily_General" unselectable="on" ext:qtip="Sort by General Status"><A class=x-grid3-hd-btn id=statusFamily_General href="#"></A><SPAN class=hiddenHeader>General Status</SPAN><IMG class=x-grid3-sort-icon src=""></DIV></TD>
              <TD class="x-grid3-hd x-grid3-cell x-grid3-td-name x-grid3-sort-asc1" style="WIDTH: 118px">
              <DIV class="x-grid3-hd-inner x-grid3-hd-name" unselectable="on" ext:qtip="Sort by Name"><A class=x-grid3-hd-btn id=name href="#"></A>Name<IMG class=x-grid3-sort-icon src=""></DIV></TD>
              <TD class="x-grid3-hd x-grid3-cell x-grid3-td-number" style="WIDTH: 118px">
              <DIV class="x-grid3-hd-inner x-grid3-hd-number" unselectable="on" ext:qtip="Sort by Number"><A class=x-grid3-hd-btn id=number href="#"></A>Number<IMG class=x-grid3-sort-icon src=""></DIV></TD>
              </TR>
             </THEAD>
            </TABLE>
           </DIV>
          </DIV>
         </DIV>
          <DIV class=x-grid3-scroller id=ext-gen1813 style="HEIGHT: 95px; WIDTH: auto">
           <DIV class=x-grid3-body id=ext-gen1814 style="WIDTH: 1375px">
            <DIV class="x-grid3-row x-grid3-row-first" id=ext-gen1888 style="HEIGHT: 22px; WIDTH: 1375px" rowIndex="0">
             <TABLE class=x-grid3-row-table style="HEIGHT: 22px; WIDTH: 1375px" border=0 cellSpacing=0 cellPadding=0>
              <TBODY>
               <TR>
                <TD tabIndex=-1 class="x-grid3-col x-grid3-cell x-grid3-td-checker x-grid3-cell-first " style="WIDTH: 18px">
                 <DIV class="x-grid3-cell-inner x-grid3-col-checker">
                  <DIV class=x-grid3-row-checker>&nbsp;</DIV>
                 </DIV>
                </TD>
                <TD tabIndex=-1 class="x-grid3-col x-grid3-cell x-grid3-td-name " style="WIDTH: 118px">
                 <DIV class="x-grid3-cell-inner x-grid3-col-name" ext:qtip=""></DIV>
                </TD>
                <TD tabIndex=-1 class="x-grid3-col x-grid3-cell x-grid3-td-number " style="WIDTH: 118px">
                 <DIV class="x-grid3-cell-inner x-grid3-col-number">
                  <A class=linkfont id="" href="" ext:qtip=""></A>
                 </DIV>
                </TD>
               </TR>
              </TBODY>
             </TABLE>
            <DIV class="x-grid3-row x-grid3-row-alt" style="HEIGHT: 22px; WIDTH: 1375px" rowIndex="1">
             <TABLE class=x-grid3-row-table style="HEIGHT: 22px; WIDTH: 1375px" border=0 cellSpacing=0 cellPadding=0>
              <TBODY>
               <TR>
                <TD tabIndex=-1 class="x-grid3-col x-grid3-cell x-grid3-td-checker x-grid3-cell-first " style="WIDTH: 18px">
                 <DIV class="x-grid3-cell-inner x-grid3-col-checker">
                  <DIV class=x-grid3-row-checker>&nbsp;</DIV>
                 </DIV>
                </TD>
                <TD tabIndex=-1 class="x-grid3-col x-grid3-cell x-grid3-td-type_icon " style="WIDTH: 30px">
                 <DIV class="x-grid3-cell-inner x-grid3-col-type_icon"><IMG title="CAD Part" src=""></DIV>
                </TD>
                <TD tabIndex=-1 class="x-grid3-col x-grid3-cell x-grid3-td-infoPageAction " style="WIDTH: 30px">
                 <DIV class="x-grid3-cell-inner x-grid3-col-infoPageAction">
                  <A class="linkfont icon" id="" href="" ext:qtip="View information"><IMG width=16 height=16 align=middle src="netmarkets/images/details.gif" border=0 ext:qtip="View information"></A>
                 </DIV>
                </TD>
                <TD tabIndex=-1 class="x-grid3-col x-grid3-cell x-grid3-td-name " style="WIDTH: 118px">
                 <DIV class="x-grid3-cell-inner x-grid3-col-name" ext:qtip=""></DIV>
                </TD>
                <TD tabIndex=-1 class="x-grid3-col x-grid3-cell x-grid3-td-number " style="WIDTH: 118px">
                 <DIV class="x-grid3-cell-inner x-grid3-col-number">
                  <A class=linkfont id="" href="" ext:qtip=""></A>
                 </DIV>
                </TD>
               </TR>
              </TBODY>
             </TABLE>
            </DIV>
            <DIV class="x-grid3-row x-grid3-row-last" style="HEIGHT: 22px; WIDTH: 1375px" rowIndex="2"></DIV>
           </DIV>
          </DIV>
         </DIV>
        </DIV>
       </DIV>
      </DIV>
     </DIV>
    </DIV>
   </DIV>
  </DIV>
 </DIV>
 <!--CONTENT_AREA--><!-- negate onunload cancel request, page load completed -->
 <SPAN id=checkboxesFor_wt.epm.EPMDocument.defaultSearchView style="DISPLAY: none">
  <INPUT name="" id="" type=checkbox CHECKED value="">
  <INPUT name="" id="" type=checkbox CHECKED value="">
 </SPAN>
</FORM>

html vba ihtmldocument
Original Q&A
0

There are 0 answers

Related Questions in HTML

Related Questions in VBA

Related Questions in IHTMLDOCUMENT

Popular Questions

Popular Tags

javascript python java c# php android html jquery c++ css ios sql mysql r reactjs node.js arrays c asp.net json python-3.x ruby-on-rails .net sql-server swift django angular objective-c pandas excel

Trending Questions