asp.net で テキストボックスのオートコンプリート機能を実装する  次の文書

jqueryの利用が単純で簡単ですね
Page_PreInit()でscriptを作成するのがミソですね

参考にしたサイト
http://www.atmarkit.co.jp/ait/articles/0904/06/news109_3.html

<%@ Page Language="VB" %>
<html>
<head id="Head1" runat="server">
<script src="Scripts/jquery-1.4.1.js"></script>
<script src="Scripts/jquery.autocomplete.js"></script>
<link rel="stylesheet" href="Styles/jquery.autocomplete.css" />
<title></title>
</head>
<body>
<form id="form1" runat="server">
<div>
<asp:Label ID="namexdata" runat="server" Text="Label"></asp:Label>
<asp:TextBox ID="namex" runat="server"></asp:TextBox>
<asp:Button ID="Button1" runat="server" Text="Button" />
<asp:Label ID="Label1" runat="server" Text="Label"></asp:Label>
</div>
</form>
</body>
</html>



Partial Class Default5
Inherits System.Web.UI.Page

Protected Sub Page_PreInit(ByVal sender As Object, ByVal e As System.EventArgs) Handles Me.Init
namexdata.Text = ""
namexdata.Text = namexdata.Text & "<script type=""text/javascript"">"
namexdata.Text = namexdata.Text & "$(document).ready("
namexdata.Text = namexdata.Text & "function () {"
namexdata.Text = namexdata.Text & "$('#namex').autocompleteArray("
namexdata.Text = namexdata.Text & "["

'ここからのデータはDBから取得することになります。
'データは " で囲む、カンマで区切る
namexdata.Text = namexdata.Text & """sasaki"", "
namexdata.Text = namexdata.Text & """sakasita"", "
namexdata.Text = namexdata.Text & """yasuda"", "
namexdata.Text = namexdata.Text & """yamada"", "
namexdata.Text = namexdata.Text & """yoshida"""
'ここまでのデータはDBから取得する

namexdata.Text = namexdata.Text & "]"
namexdata.Text = namexdata.Text & ");"
namexdata.Text = namexdata.Text & "});"
namexdata.Text = namexdata.Text & "</script>"
End Sub

Protected Sub Button1_Click(sender As Object, e As System.EventArgs) Handles Button1.Click
Label1.Text = namex.Text
End Sub
End Class

 




← 左の文字をここへ入力後 登録ボタンをクリックしてください

(サイト管理者承認後掲載されます)