HTML5 datalist

[ItHurtsWhenIThink]

I'm just playing around with new html tags.

Here is my first experiment, dynamic list box.

Here is my code:

<input list="frmUsers">
<datalist id="frmUsers">
<%
sql="select FName+ ' ' +LName AS FullName, UID from members"
Set rs = Server.CreateObject("ADODB.Recordset")
rs.Open sql, conn, 1, 3
If NOT rs.EOF Then
While NOT rs.EOF
%>
<option value="<%=rs("UID")%>"><%=rs("FullName")%></option>
<%
rs.MoveNext
WEND
End If
%>
</datalist>

Naturally, that wont work. That's what I use right now in my pages (except encrypted).

How can it off using datalist?

Thanks.

 

[ChrisHirst]

That appears to be server side ASP (forum333) rather than HTML.

Chris.

Indifference will be the downfall of mankind, but who cares?
Time flies like an arrow, however, fruit flies like a banana.
Webmaster Forum

 

[vacunita]

Naturally, that wont work.

Why not?

What does the actual HTML look like after its been rendered by the ASP?

The HTML 5 datalist will look like a standard input box, but after you click on it it will show the options.


What is not working?





----------------------------------
Phil AKA Vacunita
----------------------------------
Ignorance is not necessarily Bliss, case in point:
Unknown has caused an Unknown Error on Unknown and must be shutdown to prevent damage to Unknown.

Web & Tech

 

[ItHurtsWhenIThink]

When I click on the list box it populates the list with the 'FullName' values. But as soon as I start typing a name the list drops off. That's because its auto-filling by UID. If I just go down and select a user from the dropdown list, the box displays the UID value (numeric).

I need to pass the UID value.

 

[ChrisHirst]

I need to pass the UID value.

Until we see the rendered HTML we have no idea what you are talking about.

Chris.

Indifference will be the downfall of mankind, but who cares?
Time flies like an arrow, however, fruit flies like a banana.
Webmaster Forum

 

[feherke]

Hi

[tt]datalist[/tt] is implemented inconsistently across the browsers :
[pre]
┌───────────┬──────────┬──────────────┬────────┬───────────┬───────────┐
│ Rendering │ Dropdown │ Dropdown │ Search │ Search │ Completes |
│ engine │ on focus │ content │ in │ at │ with │
├───────────┼──────────┼──────────────┼────────┼───────────┼───────────┤
│ Gecko │ no │ text │ text │ anywhere │ value │
│ Presto │ yes │ value │ text │ beginning │ value │
│ Trident │ yes │ text │ value │ beginning │ value │
│ WebKit │ no │ value + text │ value │ beginning │ value │
└───────────┴──────────┴──────────────┴────────┴───────────┴───────────┘
[/pre]

If you want consistent behavior, you have to use a JavaScript implementation, for example the jQuery UI Autocomplete. Which of course, is slower then the native implementations.

So, what exactly you want to achieve and in which browser ?


Feherke.
feherke.ga

 

[ItHurtsWhenIThink]

using Trident.

So it looks like DataList would only work with Gecko.

Thanks for the info.

For those that asked, here is the rendering from my script (all fictitious data)


<input list="frmUsers">
<datalist id="frmUsers">

<option value="1">Tony Adams</option>

<option value="6">Anna Banana</option>

<option value="7">Marvin Martian</option>

<option value="8">Elmer Fudd</option>

<option value="12">Marvin Skalansky</option>

<option value="13">Dang Ed</option>

<option value="14">Oscar Lujan</option>

<option value="17">Paul Ortiz</option>

<option value="40">Mike Spencer</option>

<option value="42">Brian Branko</option>

<option value="110">Donald Winters</option>

<option value="113">Dan gonzales</option>

<option value="120">Fred Nelson</option>

</datalist>