如何在单个文本框中多次使用自动完成扩展程序?

时间:2015-06-15 08:54:32

标签: c# jquery asp.net autocomplete

我正在ASP.NET中开发基于房地产的应用程序。在这里,我想 使用自动完成扩展程序来获取城市。我试过以下

以下是设计部分,其中我使用名为“txtCity”的<table cellspacing="0" cellpadding="0" border="0" width="100%" class="yfnc_tabledata1" id="yui_3_9_1_9_1434360249110_44"><tbody id="yui_3_9_1_9_1434360249110_43"><tr id="yui_3_9_1_9_1434360249110_42"><td id="yui_3_9_1_9_1434360249110_41"><table cellspacing="0" cellpadding="2" border="0" width="100%" id="yui_3_9_1_9_1434360249110_40"><tbody id="yui_3_9_1_9_1434360249110_39"><tr style="border-top:none;" class="yfnc_modtitle1"><td style="border-top:2px solid #000;" colspan="2"><small><span class="yfi-module-title">Period Ending</span></small></td><th style="border-top:2px solid #000;text-align:right; font-weight:bold" scope="col">Dec 31, 2014</th><th style="border-top:2px solid #000;text-align:right; font-weight:bold" scope="col">Dec 31, 2013</th><th style="border-top:2px solid #000;text-align:right; font-weight:bold" scope="col">Dec 31, 2012</th></tr><tr id="yui_3_9_1_9_1434360249110_38"><td colspan="2" id="yui_3_9_1_9_1434360249110_37"> <strong> Total Revenue </strong> </td><td align="right"> <strong> 31,821,000&nbsp;&nbsp; </strong> </td><td align="right"> <strong> 30,871,000&nbsp;&nbsp; </strong> </td><td align="right"> <strong> 29,904,000&nbsp;&nbsp; </strong> </td></tr><tr><td colspan="2">Cost of Revenue</td><td align="right">16,447,000&nbsp;&nbsp;</td><td align="right">16,106,000&nbsp;&nbsp;</td><td align="right">15,685,000&nbsp;&nbsp;</td></tr><tr><td style="height:0;padding:0; border-top:3px solid #333;" colspan="5"><span style="display:block; width:5px; height:1px;"></span></td></tr><tr><td colspan="2"> <strong> Gross Profit </strong> </td><td align="right"> <strong> 15,374,000&nbsp;&nbsp; </strong> </td><td align="right"> <strong> 14,765,000&nbsp;&nbsp; </strong> </td><td align="right"> <strong> 14,219,000&nbsp;&nbsp; </strong> </td></tr><tr><td style="height:0;padding:0; " colspan="5"><span style="display:block; width:5px; height:10px;"></span></td></tr><tr> <td><spacer width="1" height="1" type="block"></spacer></td> <td colspan="4" class="yfnc_d">Operating Expenses</td></tr><tr> <td width="30" class="yfnc_tabledata1"><spacer height="1" width="30" type="block"></spacer></td> <td>Research Development</td><td align="right">1,770,000&nbsp;&nbsp;</td><td align="right">1,715,000&nbsp;&nbsp;</td><td align="right">1,634,000&nbsp;&nbsp;</td></tr><tr> <td width="30" class="yfnc_tabledata1"><spacer height="1" width="30" type="block"></spacer></td> <td>Selling General and Administrative</td><td align="right">6,469,000&nbsp;&nbsp;</td><td align="right">6,384,000&nbsp;&nbsp;</td><td align="right">6,102,000&nbsp;&nbsp;</td></tr><tr> <td width="30" class="yfnc_tabledata1"><spacer height="1" width="30" type="block"></spacer></td> <td>Non Recurring</td><td align="right"> - &nbsp;</td><td align="right"> - &nbsp;</td><td align="right"> - &nbsp;</td></tr><tr> <td width="30" class="yfnc_tabledata1"><spacer height="1" width="30" type="block"></spacer></td> <td>Others</td><td align="right"> - &nbsp;</td><td align="right"> - &nbsp;</td><td align="right"> - &nbsp;</td></tr><tr> <td><spacer width="1" height="1" type="block"></spacer></td> <td class="yfnc_d" style="height:0; padding:0; " colspan="5"><span style="display:block; width:5px; height:1px;"></span></td></tr><tr> <td width="30" class="yfnc_tabledata1"><spacer height="1" width="30" type="block"></spacer></td> <td>Total Operating Expenses</td><td align="right"> - &nbsp;</td><td align="right"> - &nbsp;</td><td align="right"> - &nbsp;</td></tr><tr><td style="height:0;padding:0; " colspan="5"><span style="display:block; width:5px; height:10px;"></span></td></tr><tr><td style="height:0;padding:0; border-top:3px solid #333;" colspan="5"><span style="display:block; width:5px; height:1px;"></span></td></tr><tr><td colspan="2"> <strong> Operating Income or Loss </strong> </td><td align="right"> <strong> 7,135,000&nbsp;&nbsp; </strong> </td><td align="right"> <strong> 6,666,000&nbsp;&nbsp; </strong> </td><td align="right"> <strong> 6,483,000&nbsp;&nbsp; </strong> </td></tr><tr><td style="height:0;padding:0; " colspan="5"><span style="display:block; width:5px; height:10px;"></span></td></tr><tr> <td><spacer width="1" height="1" type="block"></spacer></td> <td colspan="4" class="yfnc_d">Income from Continuing Operations</td></tr><tr> <td width="30" class="yfnc_tabledata1"><spacer height="1" width="30" type="block"></spacer></td> <td>Total Other Income/Expenses Net</td><td align="right">33,000&nbsp;&nbsp;</td><td align="right">41,000&nbsp;&nbsp;</td><td align="right">39,000&nbsp;&nbsp;</td></tr><tr> <td width="30" class="yfnc_tabledata1"><spacer height="1" width="30" type="block"></spacer></td> <td>Earnings Before Interest And Taxes</td><td align="right">7,168,000&nbsp;&nbsp;</td><td align="right">6,707,000&nbsp;&nbsp;</td><td align="right">6,522,000&nbsp;&nbsp;</td></tr><tr> <td width="30" class="yfnc_tabledata1"><spacer height="1" width="30" type="block"></spacer></td> <td>Interest Expense</td><td align="right">142,000&nbsp;&nbsp;</td><td align="right">145,000&nbsp;&nbsp;</td><td align="right">171,000&nbsp;&nbsp;</td></tr><tr> <td width="30" class="yfnc_tabledata1"><spacer height="1" width="30" type="block"></spacer></td> <td>Income Before Tax</td><td align="right">7,026,000&nbsp;&nbsp;</td><td align="right">6,562,000&nbsp;&nbsp;</td><td align="right">6,351,000&nbsp;&nbsp;</td></tr><tr> <td width="30" class="yfnc_tabledata1"><spacer height="1" width="30" type="block"></spacer></td> <td>Income Tax Expense</td><td align="right">2,028,000&nbsp;&nbsp;</td><td align="right">1,841,000&nbsp;&nbsp;</td><td align="right">1,840,000&nbsp;&nbsp;</td></tr><tr> <td width="30" class="yfnc_tabledata1"><spacer height="1" width="30" type="block"></spacer></td> <td>Minority Interest</td><td align="right">(42,000)</td><td align="right">(62,000)</td><td align="right">(67,000)</td></tr><tr> <td><spacer width="1" height="1" type="block"></spacer></td> <td class="yfnc_d" style="height:0; padding:0; " colspan="5"><span style="display:block; width:5px; height:1px;"></span></td></tr><tr> <td width="30" class="yfnc_tabledata1"><spacer height="1" width="30" type="block"></spacer></td> <td>Net Income From Continuing Ops</td><td align="right">4,956,000&nbsp;&nbsp;</td><td align="right">4,659,000&nbsp;&nbsp;</td><td align="right">4,444,000&nbsp;&nbsp;</td></tr><tr><td style="height:0;padding:0; " colspan="5"><span style="display:block; width:5px; height:10px;"></span></td></tr><tr> <td><spacer width="1" height="1" type="block"></spacer></td> <td colspan="4" class="yfnc_d">Non-recurring Events</td></tr><tr> <td width="30" class="yfnc_tabledata1"><spacer height="1" width="30" type="block"></spacer></td> <td>Discontinued Operations</td><td align="right"> - &nbsp;</td><td align="right"> - &nbsp;</td><td align="right"> - &nbsp;</td></tr><tr> <td width="30" class="yfnc_tabledata1"><spacer height="1" width="30" type="block"></spacer></td> <td>Extraordinary Items</td><td align="right"> - &nbsp;</td><td align="right"> - &nbsp;</td><td align="right"> - &nbsp;</td></tr><tr> <td width="30" class="yfnc_tabledata1"><spacer height="1" width="30" type="block"></spacer></td> <td>Effect Of Accounting Changes</td><td align="right"> - &nbsp;</td><td align="right"> - &nbsp;</td><td align="right"> - &nbsp;</td></tr><tr> <td width="30" class="yfnc_tabledata1"><spacer height="1" width="30" type="block"></spacer></td> <td>Other Items</td><td align="right"> - &nbsp;</td><td align="right"> - &nbsp;</td><td align="right"> - &nbsp;</td></tr><tr><td style="height:0;padding:0; " colspan="5"><span style="display:block; width:5px; height:10px;"></span></td></tr><tr><td style="height:0;padding:0; border-top:3px solid #333;" colspan="5"><span style="display:block; width:5px; height:1px;"></span></td></tr><tr><td colspan="2"> <strong> Net Income </strong> </td><td align="right"> <strong> 4,956,000&nbsp;&nbsp; </strong> </td><td align="right"> <strong> 4,659,000&nbsp;&nbsp; </strong> </td><td align="right"> <strong> 4,444,000&nbsp;&nbsp; </strong> </td></tr><tr><td colspan="2">Preferred Stock And Other Adjustments</td><td align="right"> - &nbsp;</td><td align="right"> - &nbsp;</td><td align="right"> - &nbsp;</td></tr><tr><td style="height:0;padding:0; border-top:3px solid #333;" colspan="5"><span style="display:block; width:5px; height:1px;"></span></td></tr><tr><td colspan="2"> <strong> Net Income Applicable To Common Shares </strong> </td><td align="right"> <strong> 4,956,000&nbsp;&nbsp; </strong> </td><td align="right"> <strong> 4,659,000&nbsp;&nbsp; </strong> </td><td align="right"> <strong> 4,444,000&nbsp;&nbsp; </strong> </td></tr></tbody></table></td></tr></tbody></table> 以及目标控件为“txtCity”的自动完成扩展程序 Web服务方法是“GetCities”。

TextBox

以下是Webservice方法,它将以列表的形式返回城市名称。

<%@ Register Assembly="AjaxControlToolkit" Namespace="AjaxControlToolkit" TagPrefix="ajax" %>
<html xmlns="http://www.w3.org/1999/xhtml">
  <head runat="server">
    <title>Ajax AutoCompleteExtender without Webservice</title>
  </head>
  <body>
    <form id="form1" runat="server">
      <ajax:ToolkitScriptManager ID="ScriptManager1" runat="server"/>
      <div>
        <asp:TextBox ID="txtCity" runat="server"></asp:TextBox>
        <ajax:AutoCompleteExtender ID="AutoCompleteExtender1" runat="server" 
              TargetControlID="txtCity" MinimumPrefixLength="1" EnableCaching="true" 
              CompletionSetCount="1" CompletionInterval="1000" ServiceMethod="GetCities" >
        </ajax:AutoCompleteExtender>
      </div>
    </form>
  </body>
</html>

在这里,当我输入任何字符时,所有匹配该字符的城市都会以下拉方式显示,并且在选择任何城市后,所选城市将显示在文本框中。

当我搜索其他城市时,新城市将显示在文本框中,同时删除之前选择的城市。但我不希望以前选定的城市消失。

我想使用像99acres.com这样的网站使用的功能。

1 个答案:

答案 0 :(得分:0)

正在使用RAD控件http://demos.telerik.com/aspnet-ajax/autocompletebox/examples/default/defaultcs.aspx

演示确切的功能

您只需要设置SQL数据源和AJAX包装。

截图: