Eclipsed4utoo's Blog

Recently, I needed to add a color picker to a web application.  I thought I would try the new AJAX toolkit, but the toolkit was full of issues so I had to resort to doing it with javascript.  I downloaded a color picker that somebody had done(and donated for their development).

When I went to add the external javascript file and the other associated files, my AJAX page would no longer show up.  Anything inside of an UpdatePanel would not show up.  I did some searching and found that using an external javascript file can cause AJAX to fail.

I originally had this code which was giving me issues.

<asp:Content ID="Content1" ContentPlaceHolderID="MainContent" runat="server">
    <asp:ScriptManagerProxy ID="ScriptManagerProxy1" runat="server" />
    <script src="../Javascript/jscolor/jscolor.js" type="text/javascript" />

    <asp:UpdatePanel ID="UpdatePanel1" runat="server">
       <%--   some controls  --%>
    </asp:UpdatePanel>
</asp:Content>

I used the ScriptReference in the ScriptManagerProxy to add a reference to the javascript file:

<asp:Content ID="Content1" ContentPlaceHolderID="MainContent" runat="server">
    <asp:ScriptManagerProxy ID="ScriptManagerProxy1" runat="server">
       <Scripts>
          <asp:ScriptReference Path="~/Javascript/jscolor/jscolor.js" />
       </Scripts>
    </asp:ScriptManagerProxy>

    <asp:UpdatePanel ID="UpdatePanel1" runat="server">
       <%--   some controls  --%>
    </asp:UpdatePanel>
</asp:Content>

And that worked.  The controls inside the UpdatePanel now show up.