【IT168技术文档】
首先新建一个AJAXEnable的空网站，托入一个ScriptManager及两个Update Panel。第一个Panel放置一个文本框、一个列表框（作为提示框）、一个LinkButton（用于提交），及一些指示用的Label；另一个 Panel放置一个GridView（用于显示已存在的词）。其中列表框需要放置在一个<div />中以实现显隐。具体编码如下：
1<form id="form1" runat="server"> 2 <asp:ScriptManager ID="ScriptManager1" runat="server" /> 3 <table> 4 <tr> 5 <td valign="top"> 6 <asp:UpdatePanel ID="InsertWordUpdatePanel" runat="server" UpdateMode="Conditional"> 7 <ContentTemplate> 8 <table cellpadding="2" style="width:300px; height:100px; border:solid 1px #999999"> 9 <tr> 10 <td style="width: 20px"><asp:Label ID="StrWordLabel" runat="server" AssociatedControlID="StrWordTextBox" Text="Word" /></td> 11 <td align="left"> 12 <input type="text" size="18" id="StrWordTextBox" onkeyup="TextUtil.autosuggest(this, TextUtil.getArrWords(), 'suggestionList')" runat="server" /><br /> 13 <div id="suggestion" style="width:150px; height:auto; display:none; position:absolute "> 14 <select id="suggestionList" size="6" style="width:150px" onclick="setText(this, 'StrWordTextBox')"></select> 15 </div> 16 </td> 17 <td align="center" style="height: 50px"> 18 <asp:LinkButton ID="InsertButton" runat="server" Text="Insert Word" OnClick="InsertButton_Click" /></td> 19 </tr> 20 <tr> 21 <td colspan="3" align="center" style="height: 23px"><asp:Label ID="InputTimeLabel" runat="server"><%=DateTime.Now %></asp:Label></td> 22 </tr> 23 </table><br /> 24 </ContentTemplate> 25 </asp:UpdatePanel> 26 </td> 27 <td valign="top"> 28 <asp:UpdatePanel ID="WordsUpdatePanel" runat="server" UpdateMode="Conditional"> 29 <ContentTemplate> 30 <asp:GridView ID="WordsGridView" runat="server" AutoGenerateColumns="False" Width="200px"> 31 <Columns> 32 <asp:BoundField DataField="WordID" HeaderText="Word ID" /> 33 <asp:BoundField DataField="StrWord" HeaderText="Word" /> 34 </Columns> 35 <PagerSettings PageButtonCount="5" /> 36 </asp:GridView><br /> 37 <asp:Label runat="server" ID="ListTimeLabel"><%=DateTime.Now %></asp:Label> 38 </ContentTemplate> 39 <Triggers> 40 <asp:AsyncPostBackTrigger ControlID="InsertButton" EventName="Click" /> 41 </Triggers> 42 </asp:UpdatePanel> 43 </td> 44 </tr> 45 </table> 46</form>
