Locate ASP.Net AJAX AutoCompleteExtender inside TabContainer

ASP.Net Ajax contains rich array of controls used to create an interactive Web experience.While creating a ajax website you might face problems in binding two controls.For example locating AutoCompleteExtender inside the tab Container.Let us see how to solve this above problem.

1.   First, create the a script manager in your .aspx page.like this,

<asp:ScriptManager ID="ScriptManager1" runat="server">
</asp:ScriptManager>

As a server-side control, ScriptManager reacts to events in the ASP.NET page life cycle and uses those events to coordinate the activities of all the controls, options, and code employed by ASP.NET AJAX.

2.   Create the Tab Container,inside it create one or more Tab Panel like

<cc1:TabContainer ID="Container1" runat="server"  ActiveTabIndex="1" >

<cc1:TabPanel ID="tpanel1" runat="server" HeaderText="Sample Tab">

<ContentTemplate>

//place other controls here(Eg:labels,buttons,textboxes,etc..)</ContentTemplate>

</cc1:TabPanel>

</cc1:TabContainer>

3.  Here AutoCompleteExtender is also acting as a controls of tpanel1,So your will be look like this

<cc1:TabContainer ID="Container1" runat="server"  ActiveTabIndex="1" >

<cc1:TabPanel ID="tpanel1" runat="server" HeaderText="Sample Tab">

<ContentTemplate>

//place other controls here(Eg:labels,buttons,textboxes,etc..)  including the textbox(txt_sample)

//here is the code for autocompleteextender

<cc1:AutoCompleteExtender ID="AutoCompleteExtender1"  runat="server" ServiceMethod="GetCompletionList1"
DelimiterCharacters="" Enabled="True" ServicePath="" CompletionInterval ="500" MinimumPrefixLength="1"
UseContextKey="True"  TargetControlID="txt_sample" >
</cc1:AutoCompleteExtender>

</ContentTemplate>

</cc1:TabPanel>

</cc1:TabContainer>

4. Create a Service Method in .cs page for working with autocomplete textbox.

Have a  Happy Coding...