Dynamic Dependent Drop Down Boxes

I am using the following script to enable the use of dynamic dependent drop down boxes. Everything working correctly but on the child drop down box I need to display last names and first names of people. Currently it displays only last names. Any help is appreciated.

<tr>
<td><font size="1" face="Verdana"><b>Department</b></font></td>
<td> <font size="1" face="Verdana">
<select name="types" id="types" onChange="fillItems(0)">
<option selected> Select a Department:
<%
While (NOT types.EOF)
%>
<option value="<%=(types.Fields.Item("DepartmentID").Value)%>"><%=(types.Fields.Item("DepartmentName").Value)%></option>
<%
types.MoveNext()
Wend
If (types.CursorType > 0) Then
types.MoveFirst
Else
types.Requery
End If
%>
</select>
</font></td>
<td><font size="1" face="Verdana"><b>Employee </b></font></td>
<td> <font size="1" face="Verdana">
<select name="items" id="items">
<option selected> Select an Employee:


</select>
</font></td>
</tr>
<tr>
<td>&nbsp;</td>
<td>&nbsp;</td>
<td>&nbsp;</td>
<td>&nbsp;</td>
</tr>
<tr>
<td>&nbsp;</td>
<td>&nbsp;</td>
<td><font size="1" face="Verdana">
<input type="submit" value="Add" name="Submit1">
<input type="reset" value="Reset" name="B2">
</font></td>
<td>&nbsp;</td>
</tr>
</table>
</table>
<p>
<%'end if%>
</p>
<p>&nbsp;</p>
<p>&nbsp;</p>
<p>&nbsp;</p>
<p>&nbsp;</p>
</form>
</body>
</html>
<script language="JavaScript">
var arItems = new Array()

arItems = [
<%
set objRS = server.CreateObject ("adodb.recordset")
objRS.open "Select departmentid, employeeid, employeelname, employeefname from employee order by employeelname",conn,1,3
arItems = objRS.GetRows()
objRS.Close()

for t = 0 to uBound( arItems, 2 )
response.Write( "[" & arItems( 0, t ) & "," & arItems( 1, t ) & "," & "'" & arItems( 2, t ) & "'" & "," & "'" & arItems( 3, t ) & "'" & "]" )
if t < uBound( arItems, 2 ) then response.Write("," & vbCrLf )
next
%>
]
function fillItems( intStart ) {
var fTypes = document.form1.types
var fItems = document.form1.items
var a = arItems
var b, c, d, intItem, intType

if ( intStart > 0 ) {
for ( b = 0; b < a.length; b++ ) {
if ( a[b][1] == intStart ) {
intType = a[b][0];
}
}
for ( c = 0; c < fTypes.length; c++ ) {
if ( fTypes.options[ c ].value == intType ) {
fTypes.selectedIndex = c;
}
}
}

if ( intType == null ) {
intType = fTypes.options[ fTypes.selectedIndex ].value
}
fItems.options.length = 0;
for ( d = 0; d < a.length; d++ ) {
if ( a[d][0] == intType ) {
fItems.options[ fItems.options.length ] = new Option( a[d][2], a[d][1] ); // no line-break here
}
if ( a[d][1] == intStart ) {
fItems.selectedIndex = fItems.options.length - 1;
}
}
}
</script>





<%
types.Close()
Set types = Nothing
%>

fItems.options[ fItems.options.length ] = new Option( a[d][2], a[d][1] ); // no line-break here

In the above line of code if I change the a[d][2] to a[d][3], the person's first name appears in the child drop box. If just add a[d][3] to make " a[d][3], a[d][2], a[d][1] " only the first name appears. I have played around with this line by placing the a[d][3] in different positions but I still don't see how to make it display firstnames and lastnames.

Is it possible to present us with a script after your serverside code has run?
It's easier to debug Javascript from the client side