AJAX Control Toolkit and Master pages

Last post 02-01-2008 3:37 PM by adith06. 5 replies.

Sort Posts:

  • AJAX Control Toolkit and Master pages

    01-31-2008, 2:04 PM
    • Member
      point Member
    • adith06
    • Member since 01-31-2008, 1:57 PM
    • Posts 7

    I am using master pages(VisualStudio2008 and Framework 3.5) for my development. Downloaded AJAX control toolkit for FW3.5. I wanted to use 'Collapsible Panel Extender' in my page. Since I use master pages, I cannot have the following tag. Is there any alternative for this. My project was converted from VS2005 to VS2008.

    Anyhelp is greatly appreciated.

     <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">

     

     

  • Re: AJAX Control Toolkit and Master pages

    01-31-2008, 2:32 PM

    I haven't gotten my new image yet (hint to any of my IT guys reading this) but we're converting to VS08 soon.  Actually one of my team guys just got it and he's getting conversion issues right now.  Maybe I'll just keep the old image...

    Anyhooo,

    the DOCTYPE tag is in your master page, right?  You don't need a doctype tag in the content page.  At all.  But you need to put your ScriptManager on the MasterPage.  And you need this in the content page above the content tag:

    <%@ Register Assembly="System.Web.Extensions, Version=1.0.61025.0, Culture=neutral, PublicKeyToken=31bf3856ad364e35"

    Namespace="System.Web.UI" TagPrefix="asp" %>

    And this if you use the toolkit:

    <%@ Register Assembly="AjaxControlToolkit" Namespace="AjaxControlToolkit" TagPrefix="AjaxControlToolkit" %>

    I love to display the non-secure items...
    Charlie Asbornsen
    Dont forget to click "Mark as Answer" on the post that helped you.
    This credits that member, earns you a point and marks your thread as Resolved so we will all know you have been helped.
  • Re: AJAX Control Toolkit and Master pages

    01-31-2008, 3:00 PM
    • Member
      point Member
    • adith06
    • Member since 01-31-2008, 1:57 PM
    • Posts 7

    Thanks for your reply Charlie. Can you give me some examples of Master and Content pages that uses "AJAX Control Toolkit" and "Collapsible Panel Extender"?

  • Re: AJAX Control Toolkit and Master pages

    01-31-2008, 4:01 PM

    Master:

    <%@ Master Language="C#" AutoEventWireup="true" CodeBehind="MasterPage.master.cs" Inherits="SecretSquirrelWeb.MasterPage" EnableTheming="true" %>
    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"       "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
    <%@ Register TagPrefix="SomethingSecret"  TagName="SessionUser" src="~/controls/SessionUser.ascx" mce_src="~/controls/SessionUser.ascx" %>
    <%@ Register Assembly="AjaxControlToolkit" Namespace="AjaxControlToolkit" TagPrefix="cc2" %>
    <%@ Register Assembly="System.Web.Extensions, Version=1.0.61025.0, Culture=neutral, PublicKeyToken=31bf3856ad364e35"
        Namespace="System.Web.UI" TagPrefix="asp" %>
    <html xmlns="http://www.w3.org/1999/xhtml" >
    <head id="Head1" runat="server">
        <link href="~/App_Themes/DCU/StyleSheetDCU.css" rel="stylesheet" type="text/css"/>
        <title>Something Secret</title>
    </head>
    <script language="JavaScript">
    <!--
    function mouseDown(e) {
     var shiftPressed=0;
     if (parseInt(navigator.appVersion)>3) {
      if (navigator.appName=="Netscape")
           shiftPressed=(e.modifiers-0>3);
      else shiftPressed=event.shiftKey;
      if (shiftPressed) {
       alert ('Shift-click is disabled.')
       return false;
      }
     }
     return true;
    }
    if (parseInt(navigator.appVersion)>3) {
     document.onmousedown = mouseDown;
     if (navigator.appName=="Netscape") 
      document.captureEvents(Event.MOUSEDOWN);
    }
    //-->
    </script>
    
    <body> 
        <form id="form1" runat="server">
        <asp:ScriptManager EnablePartialRendering="true" ID="ScriptManager1" runat="server"  >
        </asp:ScriptManager>
            <div id="poster" style="border-style: ridge; height: 15px">
                <asp:Panel ID="pnlPoster" runat="server" Width="100%" >
                    <span style="font-size:larger; font-weight: bold;">
                        <asp:Label ID="lblTitle" runat="server" Text="Something Secret" />
                    </span>
                    <span style="font-size:small; font-style: italic;">- I cant tell you</span>
                </asp:Panel>
            </div>
            <div>    
                <span class="LabelNoBorder">
                    <secrettag:sessionuser runat="server" id="SessionUser1" Visible="false" />
                </span>        
            </div>
            <div id="menu" runat="server" >
                <asp:SiteMapDataSource ID="SiteMapDataSource1" runat="server" ShowStartingNode="False" SiteMapProvider="XmlSiteMapProvider" />
                <table style="width: 933px" id="TABLE1" runat="server">
                    <tr>
                        <td style="width: 786px; height: 1px; border-top-style: none; border-right-style: none; border-left-style: none; border-bottom-style: none;">
                            <asp:Menu ID="Menu1" runat="server" SkinID="StandardMenu" Orientation="Horizontal" EnableTheming="true"
                            DataSourceID="SiteMapDataSource1" OnDataBound="Menu1_DataBound" OnMenuItemDataBound="Menu1_MenuItemDataBound" CssClass="Menu" >
                                <StaticMenuStyle      CssClass="StaticMenu" />
                                <StaticMenuItemStyle  CssClass="StaticMenuItem" />
                                <DynamicMenuStyle     CssClass="DynamicMenu" />
                                <DynamicSelectedStyle CssClass="DynamicSelected" />
                                <DynamicMenuItemStyle CssClass="DynamicMenuItem" />
                            </asp:Menu>
                        </td>
                    </tr>
                </table>
            </div>
            <div id="breadcrumb" >
                <asp:SiteMapPath SkinID="SiteMapPathForDarkBackground" style="border-style: ridge;"
                  ID="SiteMapPath1" RenderCurrentNodeAsLink="true" 
                  ParentLevelsDisplayed="-1" runat="server" CssClass="SiteMapPath" Width="97%" Height="27px">
                </asp:SiteMapPath>
            </div>
            <table style="border-style: ridge; height: 15px; width:100%; ">
                <tr>
                    <td style="width: 867px">
                         <asp:ContentPlaceHolder ID="ContentPlaceHolder1" runat="server">
                        </asp:ContentPlaceHolder>
                         
                    </td>
                </tr>
            </table>
        </form>
    </body>
    </html>
    
     
    Upper Part of Content Page
    <%@ Page Codebehind="EditGridThingie.generated.aspx.cs" Language="C#" MasterPageFile="~/MasterPage.Master"
        AutoEventWireup="true" EnableEventValidation="false" Inherits="Namespace.Namespace.Class"
        Title="NOYB" Description="Yaddayaddayadda." Theme="DCU"
        EnableTheming="true" %>
    
    <%@ Register Assembly="System.Web.Extensions, Version=1.0.61025.0, Culture=neutral, PublicKeyToken=31bf3856ad364e35"
        Namespace="System.Web.UI" TagPrefix="asp" %>
    <%@ Register Assembly="AjaxControlToolkit" Namespace="AjaxControlToolkit" TagPrefix="cc2" %>
    <%@ Register Assembly="SrdWebUi" Namespace="SrdWebUi" TagPrefix="cc1" %>
    <%@ Register Assembly="CslaWebUi" Namespace="CslaWebUi" TagPrefix="cslaweb" %>
    <asp:Content ID="Content1" ContentPlaceHolderID="ContentPlaceHolder1" runat="Server">
    
        <script language="javascript">
    
    <!--
    function keyDetect(e)
    {
      var ctrlPressed=0;
      var altPressed=0;
      altPressed  = e.altKey;
      ctrlPressed =e.ctrlKey;
      self.status=""
      +"altKey="  +altPressed
      +", ctrlKey=" +ctrlPressed
      if (altPressed || ctrlPressed) {
        document.getElementById("ctl00$ContentPlaceHolder1$tbxKeyIndicator").value = self.status
        if (parseInt(navigator.appVersion)>3) {
          document.onmousedown = mouseDown;
          if (navigator.appName=="Netscape") {
            document.captureEvents(Event.MOUSEDOWN);
          }
        }
        return true;
      }
      else { 
        document.getElementById("ctl00$ContentPlaceHolder1$tbxKeyIndicator").value = ""
        return false;
      }
    }
    function goLite(FRM,BTN)
    {
       window.document.forms[FRM].elements[BTN].style.borderColor = "#CC9900";
    }
    function goDim(FRM,BTN)
    {
       window.document.forms[FRM].elements[BTN].style.borderColor = "#FFCC33";
    }
    
    !-->
        </script>
    
        <asp:TextBox ID="tbxKeyIndicator" runat="server" Width="0px" Height="0px" BorderWidth="0px"
            ForeColor="#ffffcc" BackColor="#ffffcc">
        </asp:TextBox>
        <table style="vertical-align: top;">
            <tr valign="top">
                <td valign="top">
                    <asp:UpdatePanel ID="UpdatePanelFilter" runat="server">
                        <ContentTemplate>
                            <span style="border-width: thin;">
                                <table border="1" cellpadding="3">
                                    <tr>
                                        <td>
                                            <cc2:CollapsiblePanelExtender ID="CollapsiblePanelFilter" runat="server" TargetControlID="ContentPanelFilter"
                                                ExpandControlID="HeaderPanelFilter" CollapseControlID="HeaderPanelFilter" Collapsed="true"
                                                ExpandDirection="Vertical" ImageControlID="ToggleImageFilter" ExpandedImage="~/images/collapse.jpg"
                                                ExpandedText="Collapse" CollapsedImage="~/images/expand.jpg" CollapsedText="Expand"/>
                                            <asp:Panel ID="HeaderPanelFilter" runat="server" Style="font-size: small; font-family: Arial">
                                                <asp:Image ID="ToggleImageFilter" runat="server" />
                                                Filtering
                                            </asp:Panel>
                                            <asp:Panel ID="ContentPanelFilter" runat="server" Height="0" CssClass="collapsePanel"
                                                Style="overflow: hidden">
                                                <table border="1">
                                                    <tr>
                                                        <td align="left">
                                                            <asp:Label ID="lblFilterByCol1" runat="server" Text="Col1" Font-Names="Arial" Font-Size="Small"></asp:Label>
                                                        </td>
                                                        <td align="right">
                                                            <asp:TextBox ID="tbxFilterByCol1" runat="server"></asp:TextBox>
                                                        </td>
                                                    </tr>
                                                    <tr>
                                                        <td align="left">
                                                            <asp:Label ID="lblFilterByCol2" runat="server" Text="Col2" Font-Names="Arial"
                                                                Font-Size="Small"></asp:Label>
                                                        </td>
                                                        <td align="right">
                                                            <asp:TextBox ID="tbxFilterByCol2" runat="server"></asp:TextBox>
                                                        </td>
                                                    </tr>
                                                    <tr>
                                                        <td align="left">
                                                            <asp:Label ID="lblFilterByDate1" runat="server" Text="Date1" Font-Names="Arial"
                                                                Font-Size="Small"></asp:Label>
                                                        </td>
                                                        <td align="right" style="font-size: small; font-family: Arial">
                                                            From 
                                                            <asp:TextBox ID="tbxDate1St" runat="server" Width="70" Font-Names="Arial" Font-Size="Small"></asp:TextBox>
                                                            <cc2:CalendarExtender ID="calexDate1St" runat="server" TargetControlID="tbxDate1">
                                                            </cc2:CalendarExtender>
                                                            To 
                                                            <asp:TextBox ID="tbxDate1End" runat="server" Width="70" Font-Names="Arial" Font-Size="Small"></asp:TextBox>
                                                            <cc2:CalendarExtender ID="calexDate1End" runat="server" TargetControlID="tbxDate1End">
                                                            </cc2:CalendarExtender>
                                                        </td>
                                                    </tr>
                                                    <tr>
                                                        <td align="left" style="font-size: small; font-family: Arial">
                                                            <asp:Label ID="lblFilterByDate2" runat="server" Text="Date2" Font-Names="Arial"
                                                                Font-Size="Small"></asp:Label>
                                                        </td>
                                                        <td align="right" style="font-size: small; font-family: Arial">
                                                            From 
                                                            <asp:TextBox ID="tbxDate2St" runat="server" Width="70" Font-Names="Arial" Font-Size="Small"></asp:TextBox>
                                                            <cc2:CalendarExtender ID="calexDate2St" runat="server" TargetControlID="tbxDate2St">
                                                            </cc2:CalendarExtender>
                                                            To 
                                                            <asp:TextBox ID="tbxDate2End" runat="server" Width="70" Font-Names="Arial" Font-Size="Small"></asp:TextBox>
                                                            <cc2:CalendarExtender ID="calexDate2End" runat="server" TargetControlID="tbxDate2End">
                                                            </cc2:CalendarExtender>
                                                        </td>
                                                    </tr>
                                                    <tr>
                                                        <td align="left" style="font-size: small; font-family: Arial">
                                                            <asp:Label ID="lblFilterByBrokenRules" runat="server" Text="Broken Rules" Font-Names="Arial"
                                                                Font-Size="Small"></asp:Label>
                                                        </td>
                                                        <td align="right" style="font-size: small; font-family: Arial">
                                                            <asp:DropDownList ID="ddlFilterByBrokenRules" runat="server" Font-Names="Arial" Font-Size="Small">
                                                            </asp:DropDownList>
                                                        </td>
                                                    </tr>
                                                </table>
                                                <asp:Button ID="btnApplyFilter" runat="server" CssClass="buttons" Text="Apply" ToolTip="Click to apply filter."
                                                    OnClick="ApplyFilter" OnPreRender="btnApplyFilter_PreRender" />
                                                <asp:Button ID="btnClearFilter" runat="server" CssClass="buttons" Text="Default"
                                                    ToolTip="Click to restore default filter." OnClick="ClearFilter" OnPreRender="btnClearFilter_PreRender" />
                                            </asp:Panel>
                                        </td>
                                    </tr>
                                </table>
                            </span>
                        </ContentTemplate>
                    </asp:UpdatePanel>
                </td>
            </tr>
        </table>
     ... GridView and other stuff down here
     
    I love to display the non-secure items...
    Charlie Asbornsen
    Dont forget to click "Mark as Answer" on the post that helped you.
    This credits that member, earns you a point and marks your thread as Resolved so we will all know you have been helped.
  • Re: AJAX Control Toolkit and Master pages

    02-01-2008, 11:28 AM
    • Member
      point Member
    • adith06
    • Member since 01-31-2008, 1:57 PM
    • Posts 7

    Thanks for the code, Charlie. I made lots of change to my web.config to make it work. But now the problem is, my pages are not recognising <updatepanel> tags anymore. I understood that it is because the changes I made to the 'Web.config' file.

    <add assembly="System.Web.Extensions, Version=1.0.61025.0, Culture=neutral, PublicKeyToken=31BF3856AD364E35"/>

    The above code in web.config was replaced with the below code to accomodate '<ajaxToolkit:collapsiblepanelextender>'. Similarly I made other changes in the weg.config that is causing this problem.

     <add assembly="System.Data.DataSetExtensions, Version=3.5.0.0, Culture=neutral, PublicKeyToken=B77A5C561934E089"/>

  • Re: AJAX Control Toolkit and Master pages

    02-01-2008, 3:37 PM
    Answer
    • Member
      point Member
    • adith06
    • Member since 01-31-2008, 1:57 PM
    • Posts 7

    Found the solution for my problem. I think this might be a useful solution for others too. I made changes to my 'web.config' for the 'toolkit' to work in FrameWork 3.5. The version numbers in all '.dataextensions' in the 'web.config' all changed to '3.5.0.0'. After I made these changes, my other pages were(was developed in 2.0) not working('<updatepanel>' for AJAX extensions). So what I did was, went into the project properties and in the advanced compiler options, changed my framework to point to 3.5. After that everything seems to be working fine as before.  

    If anybody have any questions related with this issue, please reply in this thread(so that I will get an email alert and reply accordingly).

    Thanks again, Charlie.

Page 1 of 1 (6 items)