AJAX Autocomplete Extender using XML


Code in ASPX page:
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<title></title>
<link href="StyleSheet.css" rel="stylesheet" type="text/css" />
</head>
<body>
<form id="form1" runat="server">
<div>
<asp:ScriptManager ID="ScriptManager1" runat="server">
</asp:ScriptManager>
<asp:TextBox ID="TextBox1" runat="server" Height="22px"
Width="378px"></asp:TextBox>
<cc1:AutoCompleteExtender ID="TextBox1_AutoCompleteExtender"
 runat="server" DelimiterCharacters=""
  Enabled="True" MinimumPrefixLength="1"
ServiceMethod="GetCompletionList" ServicePath=""
 TargetControlID="TextBox1"
UseContextKey="True" CompletionInterval="10">
</cc1:AutoCompleteExtender>
<asp:Button ID="btnSearch" runat="server"
onclick="btnSearch_Click" Text="Search" />
<asp:GridView ID="GridView1" runat="server"
CellPadding="4" ForeColor="#333333"
GridLines="None">
<AlternatingRowStyle BackColor="White" />
<EditRowStyle BackColor="#2461BF" />
<FooterStyle BackColor="#507CD1" Font-Bold="True"
ForeColor="White" />
<HeaderStyle BackColor="#507CD1" Font-Bold="True"
ForeColor="White" />
<PagerStyle BackColor="#2461BF" ForeColor="White"
HorizontalAlign="Center" />
<RowStyle BackColor="#EFF3FB" />
<SelectedRowStyle BackColor="#D1DDF1" Font-Bold="True"
ForeColor="#333333" />
<SortedAscendingCellStyle BackColor="#F5F7FB" />
<SortedAscendingHeaderStyle BackColor="#6D95E1" />
<SortedDescendingCellStyle BackColor="#E9EBEF" />
<SortedDescendingHeaderStyle BackColor="#4870BE" />
</asp:GridView>
</div>
</form>
</body>
</html>
Code behind:
[System.Web.Services.WebMethodAttribute(), System.Web.Script.Services.ScriptMethodAttribute()]
    public static string[] GetCompletionList(string prefixText, int count, string contextKey)
    {
        XElement el =
            XElement.Load(HttpContext.Current.Request.MapPath("Items.xml"));
        var res = from x in el.Elements("Item")
        where
        x.Element("Description").Value.ToUpper().Contains(prefixText.ToUpper())
        select x.Element("Description").Value;
        return res.ToArray<string>();

    }
    protected void btnSearch_Click(object sender, EventArgs e)
    {
     XElement el = XElement.Load(MapPath("Items.xml"));
     var res = from x in el.Elements("Item")
      where x.Element("Description").Value.ToUpper().Contains(TextBox1.Text.ToUpper())
      select new
          {
            Description=x.Element("Description").Value,
            Features = x.Element("Feature").Value,
            Price = x.Element("Price").Value,
            Vendor = x.Element("Seller").Value,
            Image = x.Element("Image").Value
          };
       GridView1.DataSource = res;
      GridView1.DataBind();
    }

Download Sample Code


					
Advertisements

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s