Page and Control Flashing Using AJAX Control Toolkit Controls

Page and Control Flashing Using AJAX Control Toolkit Controls


I'm using IE7 and the ASP.NET AJAX Control Toolkit.  I'm using two controls -- Accordion and CollapsiblePanelExtender.  I'm actually using 2 CollapsiblePanelExtenders, and the Accordion control is inside one of the panels for the CollapsiblePanelExtender (see the code below).

The problem I'm seeing is that when I click an Accordion pane to open/close it or click the CollapsiblePanelExtender panel to open/close the panels, the controls and page flash while the animation is in progess.  Everything else appears to be working except for this flashing.

Would anyone know why this is happening and how to fix it?  My code is below.  Thanks in advance.

 

CSS
.collapsiblePanelLeft
{
 height: 420px;
 overflow: hidden;
 width: 250px;
}

.collapsiblePanelSpacer
{
 background-color: #EEEEEE;
 cursor: pointer;
 height: 420px;
 width: 15px;
}

.collapsiblePanelRight
{
 height: 420px;
 overflow: hidden;
 width: 735px;
}

.accordionHeader
{
    background-color: #0000B8;
    border: 1px solid Black;
    color: White;
    cursor: pointer;
 font-family: 'Trebuchet MS', Tahoma, Verdana, Arial, 'MS Sans Serif';
 font-weight: bold;
    padding: 0px;
}

.accordionContent
{
    background-color: #EEEEEE;
    border: 1px dashed Black;
    border-top: none;
    padding: 0px;
    padding-top: 0px;
}

.accordionLink
{
 background-color: Transparent;
    color: White;
}


Site.master
        <table border="0" cellpadding="2" cellspacing="0" style="width: 1000px">
            <tr>
                <td align="left" valign="top" style="width: 100%">
                    <asp:Panel ID="PanelHeader" runat="server" CssClass="panels">
                        <uc1:Header ID="Header" runat="server" />
                    </asp:Panel>
                </td>
            </tr>
            <tr>
                <td align="left" valign="top" style="width: 100%">
                    <asp:Panel ID="PanelMain" runat="server" CssClass="panels">
                        <cc1:CollapsiblePanelExtender
                            ID="CollapsiblePanelExtender1"
                            runat="server"
                            TargetControlID="PanelRight"
                            ExpandControlID="PanelSpacer"
                            CollapseControlID="PanelSpacer"
                            Collapsed="false"
                            ImageControlID="ImageSpacer"
                            CollapsedImage="Images/expand.jpg"
                            ExpandedImage="Images/collapse.jpg"
                            CollapsedSize="973"
                            ExpandedSize="723"
                            SuppressPostBack="true"
                            ExpandDirection="Horizontal">
                        </cc1:CollapsiblePanelExtender>
                        <cc1:CollapsiblePanelExtender
                            ID="CollapsiblePanelExtender2"
                            runat="server"
                            TargetControlID="PanelLeft"
                            ExpandControlID="PanelSpacer"
                            CollapseControlID="PanelSpacer"
                            Collapsed="false"
                            ImageControlID="ImageSpacer"
                            CollapsedImage="Images/expand.jpg"
                            ExpandedImage="Images/collapse.jpg"
                            CollapsedSize="0"
                            ExpandedSize="250"
                            SuppressPostBack="true"
                            ExpandDirection="Horizontal">
                        </cc1:CollapsiblePanelExtender>
                        <table border="0" cellpadding="2" cellspacing="0" style="width: 1000px">
                            <tr>
                                <td align="left" valign="top" style="height: 420px; width: 250px">
                                    <asp:Panel ID="PanelLeft" runat="server" CssClass="collapsiblePanelLeft">
                                        <cc1:Accordion
                                            ID="AccordionMenu"
                                            runat="server"
                                            AutoSize="Limit"
                                            ContentCssClass="accordionContent"
                                            FadeTransitions="true"
                                            Height="420px"
                                            HeaderCssClass="accordionHeader"
                                            SelectedIndex="0"
                                            SuppressHeaderPostbacks="true">
                                            <Panes>
                                                <cc1:AccordionPane ID="AccordionPaneHome" runat="server">
                                                    <Header>
                                                        <a href="" class="accordionLink" onclick="return false;">Home</a>
                                                    </Header>
                                                    <Content>
                                                        [content here]
                                                    </Content>
                                                </cc1:AccordionPane>
                                                <cc1:AccordionPane ID="AccordionPaneFileImport" runat="server">
                                                    <Header>
                                                        <a href="" class="accordionLink" onclick="return false;">File Import</a>
                                                    </Header>
                                                    <Content>
                                                        [content here]
                                                    </Content>
                                                </cc1:AccordionPane>
                                                <cc1:AccordionPane ID="AccordionPaneEvaluate" runat="server">
                                                    <Header>
                                                        <a href="" class="accordionLink" onclick="return false;">Evaluate</a>
                                                    </Header>
                                                    <Content>
                                                        [content here]
                                                    </Content>
                                                </cc1:AccordionPane>
                                                <cc1:AccordionPane ID="AccordionPaneSubmit" runat="server">
                                                    <Header>
                                                        <a href="" class="accordionLink" onclick="return false;">Submit</a>
                                                    </Header>
                                                    <Content>
                                                        [content here]
                                                    </Content>
                                                </cc1:AccordionPane>
                                            </Panes>
                                        </cc1:Accordion>
                                    </asp:Panel>
                                </td>
                                <td align="left" valign="top" style="height: 420px; width: 15px">
                                    <asp:Panel ID="PanelSpacer" runat="server" CssClass="collapsiblePanelSpacer">
                                        <asp:Image ID="ImageSpacer" runat="server" ImageUrl="~/Images/expand.jpg" />
                                    </asp:Panel>
                                </td>
                                <td align="left" valign="top" style="height: 420px; width: 735px">
                                    <asp:Panel ID="PanelRight" runat="server" CssClass="collapsiblePanelRight">
                                        <asp:ContentPlaceHolder ID="ContentPlaceHolderMain" Runat="server">
                                            No default content specified.
                                        </asp:ContentPlaceHolder>
                                    </asp:Panel>
                                </td>
                            </tr>
                        </table>
                    </asp:Panel>
                </td>
            </tr>
            <tr>
                <td align="left" valign="top" style="width: 100%">
                    <asp:Panel ID="PanelFooter" runat="server" CssClass="panels">
                        <uc2:Footer ID="Footer" runat="server" />
                    </asp:Panel>
                </td>
            </tr>
        </table>


.aspx
<asp:Content ID="ContentMainDefault" ContentPlaceHolderID="ContentPlaceHolderMain" Runat="Server">
    <table border="0" cellpadding="2" cellspacing="0" style="width: 100%">
        <tr>
            <td align="left" valign="top" style="width: 100%; border-right: blue 1px dashed; border-top: blue 1px dashed; border-left: blue 1px dashed; border-bottom: blue 1px dashed;">
                Main
            </td>
        </tr>
    </table>
</asp:Content>

0
lmttag
11/1/2007 3:03:51 PM
asp.net.ajax_control_toolkit 17816 articles. 1 followers. Follow

0 Replies
1360 Views

Similar Articles

[PageSpeed] 41

Reply:

Similar Artilces:

Trying to use the FAQ " Sorting and paging in the GridView control when not using data source controls "Sorting and paging in the GridView control when not using..."
and I am not getting the results I had hoped for.  I keep getting a "Compiler Error Message: CS0123: No overload for 'AdhocJobGridView_PageIndexChanged' matches delegate 'System.EventHandler'".   Here is my event handling... protected void AdhocJobGridView_PageIndexChanged(object sender, GridViewPageEventArgs e){ try { AdhocJobGridView.DataSource = wsBaseInfoArray; AdhocJobGridView.PageIndex = e.NewPageIndex; AdhocJobGridView.DataBind(); }catch (Exception ex) {throw ex; }   Here is my aspx... <asp:GridView ID="AdhocJobGridView...

Ajax Control Toolkit: Control cannot be created because Visual Studio cannot find the control's type in the control assembly.
Hi All, Good Day.  I am using ASP.Net 2.0 Framework, i have downloaded Ajax 3.0 and added reference into the project. But i am not able to add controls to the page. When i tried to add control into the page getting following error message "Control cannot be created because Visual Studio cannot find the control's type in the control assembly". I checked some forums on the web, added references in Web.Config. Still not able to proceed further. Please revert asap.  Thanks. AJAX 3.0 not work in 2.0 Framework its work in 3.5 Framework try to download another ...

Using AJAX Control toolkit classes with User Controls
Hi everybody, I've developed few User Controls that combine several input textboxes with validators. The user controls are such as Address Info, General Info, Medical Concerns, etc. In these User Controls I'd like to use some of the AJAX toolkit controls such as Masked Textbox, for example. I'm not sure about what should I do to be able to use these controls inside my User Controls. Where should I place the Script Manager? Can you please help me? Thanks a lot in advance.         Beware of bugs in the above code; I have only proved it cor...

using ajax control toolkit extender in custom control
hi, I need to use the extender in custom server control. I need to use maskeditextender. I find that I can create a maskeditextender object. (in createchildcontrols()) but I cannot achive my goal. (I created a textbox) , I cannot set the TargetControlID to be the ID of the created textbox on code-behind. that means it is useless to  use the extender object on code-behind. and is it impossible to integrate ajax toolkit extenders and asp native controls (e.g. asp:textbox) into one custom server control? thank you very much! Yes you can build controls based on the toolki...

ajax.net controls used in custom composite controls?
I am creating an events calendar that uses the accordion to display the events for the selected day.  The problem I'm having is that the accordion is not responding to any client side events.  I would really like to find a good "How to" article for building composite controls that incorporate an ajax.net control like the accordion....

The Tabs control in the AJAX Control Toolkit behaves like a regular postback control
I have the following markup in an ASP.NET page:<html xmlns="http://www.w3.org/1999/xhtml"> <head runat="server"><title>Untitled Page</title> </head> <body> <form id="form1" runat="server"> <div>   <cc1:ToolkitScriptManager runat="Server" EnablePartialRendering="true" ID="ScriptManager1"></cc1:ToolkitScriptManager> <asp:UpdatePanel ID="UpdatePanel1" runat="server"> <ContentTemplate> <cc1:TabContainer ID="TabC...

Ajax Control Toolkit extenders to controls in VS 2008 not visible from control prompt
 Joe Stagner on this video shows how to have Ajax Control Toolkit intergrated into VS 2008.There is one moment that he sais, that after the toolkit is added, web controls in VS are "extensions-aware", i.e the little arrow is displayed near the example asp:Button control with an option to "Add Extender" and then choose from the available extender for this control from the automatically generated list. I do not have this "little arrow" and i do have VS 2008 TE, .NET 3.5 and Ajax Control Toolkit referenced in my toolbox.Any ideas? Łukasz Podolak Hi Podi...

Drag and Drop standard controls using ajax control toolkit
Hi, Could anyone please let me know is there any way to drag and drop a component, like the user should be able to drag and drop a control( dragging a textbox and dropping onto a table)? Thank you You can't add AjaxControlToolkit-Framework3.5 Extenders directly on the design surface. For example - if you want to add Calendar Extender, first add TextBox on the design surface and click on "Add Extender..." and choose Calendar in new popup menu: Thanks for your reply. The sample you gave is fine but i would like the users to drag and drop the controls a...

Control of the page and the controls on a page
I am building a web app that has some pages that are public and some that are only available based on subscription. Could someone explain the best way (infrastructure wise) how to control whether a server control is visible or enabledand how to control whether a page is viewable or not based on the user and whether or not the user is logged in (or not). If a user is not logged in I would like some controls to be visible but disabled. I also have to control the URL's in case a person learnsthe URL and tries to type it in. My question is more towards how to do this database wise. I am u...

What control do I use (or do I not use a control at all...)
Okay so here's the story so far. I am making a blog to be incorporated into a website. Well, I'm doing the blog from scratch. I'm using MySQL to source all the data via MySQL .NET/Connector. Now while developing the script, I used DataReader and Response.Write to show the blog topics. Now that it has come to put it under a design (I'm using a Master Page for that), I've hit the problem. Response.Write shows all the topics before any of the design elements could be incorporated. So that (more or less) is out of question. So next I looked into the data presentation controls. I looked up GridVi...

Using controls from pages, master pages, and user controls
How would I structure my site in this scenario: I'd like to use a dropdownlist all over my site, sometimes in a regular page, sometimes in a master page, and sometimes in a user control.  I wish to bind its events programmatically, so normally I would just put that in the codebehind.  However, I notice a lot of code duplication because I have to declare the control in everywhere, in my base page (which all my pages inherit from), in my base master page (which all my master pages inherit from) and in my base user control (which all my user controls inherit from).How should I be...

AJAX Control Toolkit + hosting a control
My host has recently added support for AJAX Extensions 1.0 (they do not mention the Control Toolkit though) and I would like to add a slider control from the toolkit to my site. So I have some questions... (1) Will controls taken from the control toolkit work online or does the hoster have to have the AjaxControlToolkit.dll on their server ?  (2) If the web host does not have AjaxControlToolkit.dll, can I just include it in my site ? If I can, how do I reference it (I am currently just taking the control from my toolbox but surely this will set a reference to wherever I have...

Control used on Control gallery page
Ok, when you go to the control gallery page there is a header above each section like Charting Controls, Community, Content Management, etc. You can expand and collapse each section and the header expands to the width of the page. What control is this? I can't find it with Visual Studio 2008.  Thanks, Joe Looks like the Accordion without any sort of animation...

Ajax Control Toolkit not bringing up all the controls that it should
Hello, I have installed Ajax on my computer and it has finally worked. My collagues are using the same installations files that I used but they are not seeing all the Ajax Controls that I am seeing. I have from Accordion to Validator CalloutExtender. They don't have this toolbox Ajax Ext? Do you know what could have happened. If there is a certain order or If they need to configure something differently. Please help.. Thanks !!!Tatiana Kingking.tatiana@gmail.comcel:(561)699-4493 There is the extensions and the toolkit. You probably have both. They don'tPlease "Mark As...

Web resources about - Page and Control Flashing Using AJAX Control Toolkit Controls - asp.net.ajax_control_toolkit

Headlight flashing - Wikipedia, the free encyclopedia
Headlight flashing refers to the act of either briefly switching on the headlights of a car, or of momentarily switching between a headlight's ...

Epic Laser Blaster - A Fun Phaser Gun With Flashing Lights and Sounds (FREE) on the App Store on iTunes ...
Get Epic Laser Blaster - A Fun Phaser Gun With Flashing Lights and Sounds (FREE) on the App Store. See screenshots and ratings, and read customer ...


Milbank, Flashing H. Clinton Photo: "We Won't Tell You Who's Getting A Bottle Of Mad Bitch" Beer - YouTube ...
http://mediamatters.org/mmtv/200907310026 From Dana Milbank and Chris Cillizza's July 31 installment of their washingtonpost.com video series, ...

Flashing the cash skiing in Val-d'Isere in France - The National
Seeking out peak perfection at one of the most luxurious chalets in the Alps.

Flashing fashion
Wardrobe malfunctions have become the new press release.

A flashing exit sign from the Fed - Business Spectator
A turning point in the Federal Reserve’s discussions provide yet another type of forward guidance, and marks an important moment in the path ...

Australia's house prices 'flashing red', debt to income ratio at record levels
Australian household debt has hit a record 177 per cent of annual disposable income while housing valuations are "flashing red", according to ...

Two men in unmarked car with flashing blue and red lights attempt to pull over female driver
... impersonated police officers in Sydney&#8217;s south west this morning. The two men were driving a dark-coloured sedan which had flashing blue ...

Flashing, spitting and stealing knickers: strange things that can get you deported
A British woman was arrested and threatened with deportation this week after Sri Lankan authorities took offence to her Buddha tattoo.

Resources last updated: 1/4/2016 12:21:27 PM