How to use Ajax ScriptManager and ToolkitScriptManager in master page and content pages respectively without errors

Question

I have an Ajax Script manager in my Master page since my pages use ajax. But in one of my content pages, I need to use AutoCompleteExtender in AjaxControlToolkit which requires the use of ToolScriptManager available in the toolkit. But this leads to an error saying Only one instance of a ScriptManager can be added to the page. I searched over the internet for a solution. Many programmers suggests the use of a ScriptManagerProxy to solve this issue. Another alternative is using ToolscriptManager in the master page instead of ScriptManager. Can anyone please demonstrate how to solve this issue by using ScriptManagerProxy since I think that is a better way of solving the issue?

Here is the code of my master page:

<form runat="server" id="bodyForm">
<asp:ScriptManager ID="ScriptManager1" runat="server">
</asp:ScriptManager>
<asp:ContentPlaceHolder ID="ContentPlaceHolderBodyMain" runat="server">
</asp:ContentPlaceHolder>
</form>

And here is the code of my content page:

<asp:ToolkitScriptManager ID="ToolkitScriptManager1" runat="server">
</asp:ToolkitScriptManager>
<asp:TextBox ID="TextBoxStudentID" runat="server" autocomplete="off"></asp:TextBox>
    <asp:AutoCompleteExtender ID="AutoCompleteExtenderStudentID" runat="server" 
    EnableCaching="true" BehaviorID="AutoCompleteEx" MinimumPrefixLength="2" 
       TargetControlID="TextBoxStudentID" ServicePath="~/CampusMateWebService.asmx" ServiceMethod="GetCompletionListForStudentID" 
       CompletionInterval="50" CompletionSetCount="30" 
       CompletionListCssClass="autocomplete_completionListElement" CompletionListItemCssClass="autocomplete_listItem" 
       CompletionListHighlightedItemCssClass="autocomplete_highlightedListItem" 
       DelimiterCharacters=";, :" ShowOnlyCurrentWordInCompletionListItem="true">
    <Animations>
      <OnShow>
      <Sequence>
      <%-- Make the completion list transparent and then show it --%>
      <OpacityAction Opacity="0" />
      <HideAction Visible="true" />

      <%--Cache the original size of the completion list the first time
        the animation is played and then set it to zero --%>
      <ScriptAction Script="// Cache the size and setup the initial size
                                    var behavior = $find('AutoCompleteEx');
                                    if (!behavior._height) {
                                        var target = behavior.get_completionList();
                                        behavior._height = target.offsetHeight - 2;
                                        target.style.height = '0px';
                                    }" />
      <%-- Expand from 0px to the appropriate size while fading in --%>
      <Parallel Duration=".2">
      <FadeIn />
      <Length PropertyKey="height" StartValue="0" 
        EndValueScript="$find('AutoCompleteEx')._height" />
      </Parallel>
      </Sequence>
      </OnShow>
      <OnHide>
      <%-- Collapse down to 0px and fade out --%>
      <Parallel Duration=".2">
      <FadeOut />
      <Length PropertyKey="height" StartValueScript=
        "$find('AutoCompleteEx')._height" EndValue="0" />
      </Parallel>
      </OnHide>
      </Animations>
    </asp:AutoCompleteExtender>

Answer 1

U just add :<asp:ScriptManager ID="ScriptManager1" runat="server" /> in body asp or ContentPlaceHolder

Answer 2

I came across a similar problem while updating from an older version of AjaxControlToolkit (and upgrading from .NET 2.0 to 3.5).

Another alternative is using ToolscriptManager in the master page instead of ScriptManager. Can anyone please demonstrate how to solve this issue by using ScriptManagerProxy since I think that is a better way of solving the issue?

I don't see why that would be the better way. You would then need to place a ScriptManager on every single child page. What is wrong with just replacing the ScriptManager with ToolkitScriptManager on the Master page and be done with it?

This was found on http://www.asp.net/ajaxlibrary/act_faq.ashx:

1. What is the difference between the ScriptManager control and the ToolkitScriptManager control? We recommend that you use the ToolkitScriptManager control when using the Ajax Control Toolkit. The ToolkitScriptManager uses a later version of ASP.NET Ajax than the ScriptManager control. Also, the ToolkitScriptManager performs automatic script combining on the server. You are required to use the ToolkitScriptManager when using the Ajax Control Toolkit with ASP.NET 3.5

Answer 3

ScriptManagerProxy allows content page to pass references to the ScriptManager placed in master page.

video tutorial

ScriptManagerProxy control enables a user to add scripts and services that are specific to nested components. If a page already contains the ScriptManager control. Only one instance of the ScriptManager control can be added to a page. The page can include the control directly or indirectly inside a nested component such as a user control or nested master page. The ScriptManagerProxy control is used when the ScriptManager control is already in the page and a nested or parent component requires additional features of the ScriptManager control.

How to use AJAX package ScriptManagerProxy control in ASP.NET