HTA with dynamically generated HTML Tables with onclick faults - vbscript

Question

Right. I need help here. I have a HTA, and it runs completely fine. UNTIL I do the following to my code. I am working with VBScript. Code below:
<Script language="vbscript">
Sub DisplayDB_Click
Dim conn, str1, str2
str2 = "Hello"
MainTitle.InnerHTML = "<h2>Main Call Queue</h2>"
Set conn = CreateObject("ADODB.Connection")
conn.Open "DSN=LongbowLogin"
Set rsData = conn.Execute("SELECT * FROM MainTable WHERE CallStat='Open' ORDER BY P_ID DESC;")
str1 = "<table border=1 cellpadding=5><tr><th>Call Id</th><th>Full Name</th><th>Postcode</th><th>Site Code</th><th>Problem Title</th><th>Category</th><th>SubCategory</th><th>Call Status</th></tr>"
Do Until rsData.EOF = True
str1 = str1 & "<tr><td onclick=msgbox(str2)>" & rsData("P_Id") & "</td><td>" & rsData("FirstN") & "</td><td>" & rsData("PostCode") & "</td><td>" & rsData("SiteNumber") & "</td><td>" & rsData("PTitle") & "</td><td>" & rsData("PCat") & "</td><td>" & rsData("SCat") & "</td><td>" & rsData("CallStat") & "</td></tr>"
rsData.moveNext
Loop
str1 = str1 & "</table>"
MainDisplay.InnerHTML = str1
conn.Close
Call CheckState
End Sub
This code makes a HTML Table out of a SQL Select Statement and places it in a Span tag named MainDisplay under InnerHTML. This part works beautifully. However - After I add the
< td onclick='msgbox(str2)' > part, it will not work.
I click the first cell, and I get a message: "Line 1, 'str2' is not defined.".
I actually want it to say
< td onClick='CellID Me') > , CellID being a sub later in the same script block. I am doing this msgbox to troubleshoot.
str2 clearly is defined, so I'm clearly missing something here...
Any help here would be great, I'm going mad...
Many Thanks.

Answer 1

VBScript does no variable interpolation:
>> Dim str2 : str2 = "I'm str2 and this is my content"
>> Dim sRes : sRes = "<td onclick=MsgBox str2></td>"
>> WScript.Echo sRes
>>
<td onclick=MsgBox str2></td>
You'll have to splice the content into the result - and follow VBScript's rules about parentheses and quotes:
>> Dim str2 : str2 = "I'm str2 and this is my content"
>> Dim sRes : sRes = "<td onclick='MsgBox """ & str2 & """'></td>"
>> WScript.Echo sRes
>>
<td onclick='MsgBox "I'm str2 and this is my content"'></td>
This explains your immediate problem. Your real world task - attach a onclick event handler to all TDs - is better solved by creating the table using the DOM (.createElement, appendChild) than by trying to tame string concatenations into .innerHTML.

Answer 2

To make the MsgBox work you'll have to change this:
"<tr><td onclick=msgbox(str2)>" & rsData("P_Id") & ...
into this:
"<tr><td onclick='msgbox(""" & str2 & """)'>" & rsData("P_Id") & ...
However, I already told you that the code
"<tr><td onclick='Cell Me'>" & rsData("P_Id") & ...
works in principle. I verified this with an HTA that creates a table from a CSV on button-click.
VBScript:
Sub DisplayDB_Click
Set conn = CreateObject("ADODB.Connection")
conn.Open "Driver={Microsoft Text Driver (*.txt; *.csv)};" & _
& "Dbq=c:\Temp;Extensions=asc,csv,tab,txt;"
Set rsData = conn.Execute("SELECT * FROM sample.csv;")
str1 = "<table border=1 cellpadding=5><tr>"
For Each field In rsData.Fields
str1 = str1 & "<th>" & field.Name & "</th>"
Next
str1 = str1 & "</tr>"
Do Until rsData.EOF
str1 = str1 & "<tr>"
For Each field In rsData.Fields
str1 = str1 & "<td onclick='Cell Me'>" & field.Value & "</td>"
Next
str1 = str1 & "<tr>"
rsData.moveNext
Loop
str1 = str1 & "</table>"
MainDisplay.InnerHTML = str1
conn.Close
End Sub
Sub Cell(obj)
MsgBox obj.innerHtml
End Sub
HTML:
<p><input type="button" onClick="DisplayDB_Click" value="Show Table"/></p>
<div id="MainDisplay"></div>
If this code doesn't work for you, the issue is somewhere else in the HTA.
As Ekkehard.Horner suggested, the table could also be created using createElement and appendChild, e.g. like this:
Sub Cell
MsgBox Me.innerHtml
End Sub
Function NewField(text, isHeader)
If isHeader Then
Set e = document.createElement("th")
Else
Set e = document.createElement("td")
End If
e.AppendChild document.createTextNode(text)
e.onClick = GetRef("Cell")
Set NewField = e
End Function
Function NewRow(values, isHeader)
Set r = document.createElement("tr")
For Each v In values
r.appendChild NewField(v, isHeader)
Next
Set NewRow = r
End Function
Sub DisplayDB_Click
...
lastCol = rsData.Fields.Count-1
Dim cols
ReDim cols(lastCol)
For i = 0 To lastCol
cols(i) = rsData.Fields(i).Name
Next
Set thead = document.createElement("thead")
thead.appendChild NewRow(cols, True)
Set tbody = document.createElement("tbody")
Do Until rsData.EOF
For i = 0 To LastCol
cols(i) = rsData.Fields(i).Value
Next
tbody.appendChild NewRow(cols, False)
rsData.MoveNext
Loop
Set table = document.createElement("table")
table.appendChild thead
table.appendChild tbody
document.getElementById("parent").appendChild table
...
End Sub