A ListTextBox self-describing Control

Function: after entering data in the control, press the Space key or enter key to retrieve data items related to the current input data in the database. (Similar to Kingsoft's indexing function)
Controls have three disadvantages (no good solution)
1. Before calling the control, you must add an htmlinputhidden control named "butname" to the control and add a written. js file.
2. When selecting data items in the data list, you can only click the data item by mouse, not by keyboard.
3. You must manually set Top and Left of the list box for displaying data.
If you can tolerate these three problems, you are welcome to use them.

The source code is as follows:

Coustom. vb
Bytes -----------------------------------------------------------------------------------------------------------------------
Imports System
Imports System. Web
Imports System. Web. UI
Imports System. Collections. Specialized

Namespace good_hy
Public Class Coustom
Inherits Control
Implements IPostBackDataHandler, IPostBackEventHandler, INamingContainer

Private _ Text As String
Private _ Top As Integer
Private _ Left As Integer
Private _ DataSource As DataTable
Private _ DataField As String

Public Property Text () As string' can be accessed through the control Property in the background code, and the text content of the control is returned or set.
Get
Dim val As String
Val = Page. Request (Me. ID)
_ Text = val
Return _ Text
End Get
Set (ByVal Value As String)
_ Text = Value
Page. registerStartupScript (CStr (Rnd () * 100), "<script lanuage = javascript> document. all ('"& Me. ID &"'). value = "& _ Text &"; </script> ")
End Set
End Property

Public Property Top () As Integer 'can be accessed through the control Property in the background code, return or set the top value displayed in the control drop-down box
Get
Return _ Top
End Get
Set (ByVal Value As Integer)
_ Top = Value
End Set
End Property

Public Property Left () As Integer 'can be accessed through the control Property in the background code, return or set the left value displayed in the control drop-down box
Get
Return _ Left
End Get
Set (ByVal Value As Integer)
_ Left = Value
End Set
End Property

Public Sub listDatabind (ByVal obj As String, ByVal x As Integer, ByRef y As Integer, ByVal ds As DataTable, ByVal field As String)
'Bind data to the list box
Dim flag As String
Flag = Page. Request (Me. ID & "_ listvalues ")

If Page. IsPostBack And Page. Request ("butname") <> "" And flag = "need" Then "determine whether the control is requested to display the data list

Dim key As String 'get all control names, in String form
Key = Page. Request ("butname ")

Dim str As String ()
Str = Split (key, ",") 'extracts the name of the last Control
If Me. ID = str (str. Length-1-1) then' matches the send request Control
Dim I As Integer
Dim values As String
For I = 0 To ds. Rows. Count-1
Values = values & ds. Rows (I) (field) & ";" 'generates a data list in the form of a string
Next

Dim js As string' generates script statements running on the foreground
Js = "<script language = javascript>"
For I = 0 To str. Length-1-1
Js = js & "document. all ('"& str (I )&"'). value = '"& Page. request (str (I) & "';"' respectively assign values to the text of all controls on the page
Next 'After postback is implemented, the control value still exists
Js = js & "document. all ('butname'). value = '" & key &"';"
Key = str (str. Length-1-1) & "_ listvalues"
Js = js & "document. all ('" & key & "'). value = '" & values &"';"
Js = js & "setXY ('" & obj & "'," & x & "," & y & ");" 'sets the top, left
Js = js & "showlist (); </script>" 'displays List Data

Page. RegisterStartupScript (CStr (Rnd () * 100), js) 'register the script program
End If
End If
End Sub

Protected Overrides Sub Render (ByVal output As System. Web. UI. HtmlTextWriter)
MyBase. Render (output)
Output. Write ("<table border = 1 cellpadding = 0 cellspacing = 0> <tr> <td bgcolor = green>") 'output interface
Output. Write ("<input type = text name =" & Me. UniqueID & "onkeypress = 'getlist (this) '> ")
'Another method that causes sending back
'Output. Write ("<input type = text name =" & Me. UniqueID & "onfocus = 'getxy (this) '>", Page. GetPostBackEventReference (Me ))
Output. Write ("<input type = hidden name =" & Me. UniqueID & "_ listvalues> ")
Output. Write ("<input type = hidden name =" & Me. UniqueID & "hidx> ")
Output. Write ("<input type = hidden name =" & Me. UniqueID & "hidy> ")
Output. Write ("</td> </tr> </table> ")

End Sub

Protected Overrides Sub OnPreRender (ByVal e As System. EventArgs)
'Pre-rendering
Page. RegisterClientScriptBlock ("key1", "<script language = javascript src = 'javascript. js'> </script> ")
MyBase. OnPreRender (e)
End Sub

Public Sub RaisePostBackEvent (ByVal eventArgument As String) Implements IPostBackEventHandler. RaisePostBackEvent
'Process the send-back event
End Sub

Public Overridable Sub RaisePostDataChangedEvent () Implements IPostBackDataHandler. RaisePostDataChangedEvent
'Send a change notification
End Sub

Public Overridable Function LoadPostData (ByVal postDataKey As String, ByVal values As NameValueCollection) As Boolean Implements IPostBackDataHandler. LoadPostData
'Process the returned data
Page. RegisterRequiresRaiseEvent (Me)
Return False
End Function

End Class
End Namespace

Bytes --------------------------------------------------------------------------------------------------------------------

'Javascript. js'

Var listPopup;
ListPopup = window. createPopup ();

//-------------------------------------------------------------------------------

Function setXY (obj, x, y) // you can specify top, left in the list box.
{
Var left, top, width, tmp;
Tmp = obj + "hidx ";
Document. all (tmp). value = x;
Tmp = obj + "hidy ";
Document. all (tmp). value = y;
 
}

//---------------------------------------------------------------------------------

Function showlist () // display the control list box using popup
{
Var listPopupBody = listPopup.doc ument. body;
ListPopupBody. style. border = "solid black 1px ";
ListPopup.doc ument. body. style. fontFamily = ""
ListPopup.doc ument. body. style. fontSize = "9pt"

Var listContent
ListContent = "<table bgcolor = Moccasin width = '000000' height = '000000' border = 0 cellspacing = 0 cellpadding = 0> <tr>"
ListContent = listContent + "<td align = center> <SELECT id = 'listvalue' onclick = 'parent. showvalue (document. all (/"listvalue /"). options (document. all (/"listvalue /"). selectedIndex ). innerText) 'style = 'width: 100%; HEIGHT: 100% 'size = 2>"

Var str, values, oname;
Oname = document. all ("butname"). value;

Var arrname;
Str = document. all ("butname"). value;
Arrname = str. split (",");

Var y;
Y = arrname. length-2; //-2 is because the last element of the array is empty.
Oname = arrname [y] + "_ listvalues"; // obtain the name of the requested Control
Str = document. all (oname). value;
Values = str. split (";"); // get data

Var I;
For (I = 0; I <values. length; I ++) // generate a data item
{
ListContent = listContent + "<OPTION>" + values [I] + "</OPTION>"
}
ListContent = listContent + "</SELECT> </td>"
ListContent = listContent + "</tr> </table> ";
ListPopupBody. innerHTML = listContent;

Var left, top, width, tmp;
Tmp = arrname [y] + "hidx ";
Left = document. all (tmp). value;
Tmp = arrname [y] + "hidy ";
Top = document. all (tmp). value;

ListPopup. show (top, left, 100,200, document. body );

}

//---------------------------------------------------------------------------------

Function getlist (obj)
{
If (event. keyCode = 13 | event. keyCode = 32)
{
Var id;
Id = obj. name;
 
Var str;
Str = document. all ("butname"). value; // The butname control is used to store the name of the control.
 
 
If (str. indexOf (id) <0) // make sure that the last name is the requested
{
Document. all ("butname"). value = str + obj. name + ","; // separated ","
}
Else
{
Id = id + ",";
Str = str. replace (id ,"");
Str = str + id;
Document. all ("butname"). value = str;
}

Id = obj. name + "_ listvalues ";
Document. all (id). value = "need"; // indicates the data requested by this control.
Document. Form1.submit ();
}
 
}

//---------------------------------------------------------------------------------

Function showvalue (obj) // select a data value through the list box
{
Var oname, str, arrname, y;

Str = document. all ("butname"). value;
Arrname = str. split (",");
Y = arrname. length-2;
Oname = arrname [y];
Document. all (oname). value = obj;
 
ListPopup. hide ();
}

//----------------------------------------------------------------------------------

Bytes -------------------------------------------------------------------------------------------------------------
Smile!