AJAX :: CollapsiblePanelExtender Not Working?
Feb 2, 2010I have 4 components in my website .
1.) A.aspx
2.) B.aspx
3.) c.ascx
4.) d.js
here is the sample code of my c.ascx
<form
id="form1"
runat="server">
[code]...
I have 4 components in my website .
1.) A.aspx
2.) B.aspx
3.) c.ascx
4.) d.js
here is the sample code of my c.ascx
<form
id="form1"
runat="server">
[code]...
I am using this to display CollapsiblePanelExtender but it's not working ad I dont know why? there is no error and it workes when i set theCollapsed to True or False but not working when I run and want the user to click roCollapsed or Expand?
<asp:CollapsiblePanelExtender ID="collapsibleSkills" runat="server" Collapsed="False" TargetControlID="panelSkills" CollapseControlID="lblSkills" ExpandControlID="lblSkills" CollapsedText="[+] Skills :" ExpandedText="[-] Skills :" TextLabelID="lblSkills"
/>
i am using CollapsiblePanelExtender and button to open pdf document using response.document in same form. CollapsiblePanelExtender works fine before i click button to open pdf document using response.write and once i click on button CollapsiblePanelExtender does not work.
View 2 RepliesI am using a CollapsiblePanelExtender inside a ListView and aside from one minor, but annoying problem, it works fine. The problem is, when the page first renders, I see all the panels expanded for a short moment before they all get collapsed. There are multiple CPEs because the ListView is databound to about 45 records. I have the Collapsed=True, and based on some not-quite-clear documentation, I also set the CollapsedSize=0 and the panel's Height=0. After that last change (panel height), they are now displaying collapsed except that the gridviews inside the target panel is still showing in a sort of overlapped way. I'd upload a picture so you can see, but I don't think I can in this forum. Since the page looks like this for about a half-second, it's enough to confuse and annoy my users (and myself). Can someone please help me set this up to truly show collapsed when the page loads?
I did also try looking at the code in the AJAX Toolkit's sample website but I still don't quite understand "Collapsed - Specifies that the object should initially be collapsed or expanded. Set this to match your initial size. In this case, we initially set the panel to a height of 0 to match the CollapsedSize property, so when the page first renders, we don't see the panel expanded." If the options are True/False, why does it say to set this to match your initial size? And I did set the panel height to 0 to match the collapsedsize and it's just not working.
[Code]....
i wnat to show repater inside datalist with CollapsiblePanelExtender but not work. this is my code
[Code]....
Imports System
Imports System.Data
Imports System.Data.OleDb
Imports System.Web
Imports System.Web.UI
Imports System.Xml
Imports System.IO
Imports System.EventArgs
Imports System.Web.UI.HtmlControls
Imports System.Web.UI.WebControls
Protected Sub Page_Load(ByVal
sender As
Object,
ByVal e
As System.EventArgs)
Handles
Me.Load
Dim div1, divana
As
New HtmlGenericControl("div")
Dim lbl
As
New Label
Dim imgbt
As
New ImageButton
Dim acp
As
New AjaxControlToolkit.CollapsiblePanelExtender
Dim aacc
As
New AjaxControlToolkit.Accordion
Dim aap, aap2
As
New AjaxControlToolkit.AccordionPane
Dim cnt
As
New ContentPlaceHolder
Dim pnl
As
New Panel
Dim pnlana
As
New Panel
Dim cssUrl
As
String
Dim cssLink
As
New HtmlLink()
Dim i,n,k,p
As
Integer
Dim bag
As
New OleDbConnection
Dim s
As
String
'stylesheet add
cssUrl = Server.MapPath("daban.ccs")
cssLink.Href = cssUrl
cssLink.Attributes.Add("rel",
"stylesheet")
cssLink.Attributes.Add("type",
"text/css")
Page.Header.Controls.Add(cssLink)
'---------- find content
cnt = DirectCast(Me.Master.FindControl("ContentPlaceHolder1"),
ContentPlaceHolder)
divana.ID = "Divana"
divana.Attributes("Style") =
"padding:20px"
'---- 1. group
div1 = New HtmlGenericControl("div")
div1.ID = "divduyana"
div1.Attributes("Style") =
"padding-bottom:20px;color:#5377A9;font-family:Arial, Sans-Serif;font-weight:bold;font-ize:1.5em;"
lbl = New Label
lbl.ID = "lblana"
lbl.Text ="DUYURULAR..."
div1.Controls.Add(lbl)
divana.Controls.Add(div1)
'-----1 group end
n=3 ' normally it is getting from database
For i = 1
To n
'---- 2 group start
pnl = New Panel
pnl.ID = "Duy" + i.ToString() +
"_1"
pnl.Width = 600
pnl.Height = 30
pnl.HorizontalAlign = HorizontalAlign.Center
'image
div1 = New HtmlGenericControl("div")
div1.ID = "divimg" + i.ToString()
div1.Attributes("Style") =
"float: left; vertical-align: middle;"
imgbt = New ImageButton
imgbt.ID = "imgbt" + i.ToString()
imgbt.ImageUrl = "~/image/expand_blue.jpg"
imgbt.AlternateText = "Detaylari Goster..."
div1.Controls.Add(imgbt)
pnl.Controls.Add(div1)
'label
div1 = New HtmlGenericControl("div")
div1.ID = "divlblduy" + i.ToString()
div1.Attributes("Style") =
"float: left;"
lbl = New Label
lbl.ID = "lblduy" + i.ToString()
lbl.Text = "lbl_text balabala"
lbl.ForeColor = Drawing.Color.Red
div1.Controls.Add(lbl)
pnl.Controls.Add(div1)
' label detay goster
div1 = New HtmlGenericControl("div")
div1.ID = "divlbldet" + i.ToString()
div1.Attributes("Style") =
"float: rigth;"
lbl = New Label
lbl.ID = "lbldet" + i.ToString()
lbl.Text = "(Detaylari Goster...)"
lbl.ForeColor = Drawing.Color.Gray
div1.Controls.Add(lbl)
pnl.Controls.Add(div1)
divana.Controls.Add(pnl)
'----- 2 group end
'----- 3 group start
pnl = New Panel
pnl.ID = "Duy" + i.ToString() +
"_2"
pnl.Width = 600
' accordino
aacc = New AjaxControlToolkit.Accordion
aacc.ID = "Acc" + i.ToString()
k=2 ' normally coming from database
For t = 1
To
k
aap = New AjaxControlToolkit.AccordionPane
aap.ID = "Apane" + i.ToString() +
"_" + t.ToString()
aap.HeaderContainer.Controls.Add(New LiteralControl("anyname"))
aap.ContentContainer.Controls.Add(New LiteralControl("anycontent"))
aacc.Panes.Add(aap)
Next
aacc.HeaderCssClass = "accordionHeader"
aacc.ContentCssClass = "accordionContent"
pnl.Controls.Add(aacc)
acp = New AjaxControlToolkit.CollapsiblePanelExtender
acp.ID = "acp" + i.ToString()
acp.TargetControlID = "Duy" + i.ToString() +
"_2"
acp.ExpandControlID = "Duy" + i.ToString() +
"_1"
acp.CollapseControlID = "Duy" + i.ToString() +
"_1"
acp.Collapsed = True
acp.TextLabelID = "lbldet" + i.ToString()
acp.ImageControlID = "imgbt" + i.ToString()
acp.ExpandedText = "(Detaylari Gizle...)"
acp.CollapsedText = "(Detaylari Goster...)"
acp.ExpandedImage ="~/image/collapse_blue.jpg"
acp.CollapsedImage = "~/image/expand_blue.jpg"
acp.SuppressPostBack = True
'acp.SkinID = "CollapsiblePanelDemo"
cnt.Controls.Add(acp)
div1 = New HtmlGenericControl("div") ' this is just i add
extra
div1.ID = "divara" + i.ToString()
div1.Attributes("Style") =
"float: left;"
divana.Controls.Add(div1)
divana.Controls.Add(pnl)
Next
'----3 group end...
cnt.Controls.Add(divana)
End
Sub
<ASPX code is>
<%@
Page
Language="VB"
MasterPageFile="~/tiyap.master"
AutoEventWireup="false"
CodeFile="duyurular.aspx.vb"
Inherits="duyurular"
title="Untitled Page" %>
<%@
Register
assembly="AjaxControlToolkit"
namespace="AjaxControlToolkit"
tagprefix="ajaxToolkit" %>
<asp:Content
ID="Content1"
runat="server"
contentplaceholderid="ContentPlaceHolder1">
<ajaxToolkit:ToolkitScriptManager
ID="ToolkitScriptManager1"
runat="server">
</ajaxToolkit:ToolkitScriptManager>
</asp:Content>
there is no error...
code is working on mozzila firefox, like what i want
<div>
- collespand 1
-----accordion 1
-------acc pane 1
-------acc pane 2
- collespand 2
-----accordion 2
-------acc pane 3
-------acc pane 4
- collespand 3
-----accordion 3
-------acc pane 5
-------acc pane 6
<div>
but when i run this code inside internet explorer any version ...
result became
- collespan1
---acc 1
------ accpane1
------accpane2
----------collespan2
all going inside collespan1? what is the problem? why firefox is working ok, internet explorer not. it is a bug or i write something wrong
in DotNetNuke module,i tried CollapsiblePanelExtender, it work fine with FF,it alway explan with IE?
View 1 Replieswhen i put Collapsible panel extender inside iframe(html control) i get this error: Sys.ArgumentException: Value must not be null for Controls and Behaviors. Parameter name: element iam using VS 2008
View 3 RepliesOn the code below, I am having a problem setting up a CPE. When I run the program it does not look like the tutorial. When it collapsis nothing can be seen and the collapased text is not visable anywhere. On the tutorial there is a bar and arrow. Is that something I have to create seperately? Also, what kind of buttons should I use to toggel the panel. I would appreciate it if someone could post code showing how this works.
[Code]....
I used CollapsiblePanelExtender in a web form and would like to keep its state either collapsed or expanded by user. When user navigates away from the page and then comes back a little bit later, he still see the panel collapsed or extended. codes:formA.aspx:
<asp:Panel ID="panelPetInfoExtender" runat="server" Width="100%">
<span>Pet Information</span>
<asp:Image id="img1" runat="server" ImageUrl="collapse_blue.jpg" />
</asp:Panel>
<asp:Panel ID="panelPetInfo" runat="server">MY PET</asp:Panel>
<asp:CollapsiblePanelExtender ID="CollapsiblePanelExtender1" runat="server" TargetControlID="panelPetInfo" EnableViewState="true" ExpandControlID="panelPetInfoExtender" CollapseControlID="panelPetInfoExtender" Collapsed="true"
ImageControlID="img1" ExpandedImage="collapse_blue.jpg" CollapsedImage="expand_blue.jpg" />
I use two different collapsiblepanelExtenders with similar colapsedControlID which is not a matter here. ince both of them working but with some misbehaviour, for example if the first one is open and I click wherever on it , the second one extends. also by clicking on the second one it collapses.That means that some how an event triggers and makes them collapse or extend.I have a kind of editing panel inside each extandedPanel which are used to update something on the page. the problem is that by clicking on eachtextbox or fileupload, the second panel collapses again. before any other action. So that I can not enter the textboxes. I can do that if I use tab button on keyboard. but that sucks really.
[Code]....
it might be because the second extender is inside the collapsible panel itself. but why it doesn't stay in extended state?
I am using CollapsiblePanelExtender with following markup:
[Code]....
The expanded panel contains a table. This works fine in Firefox and IE. However, when the panel is expanded in Chrome, no content is shown or rendered in the expanded state.What could be going wrong here?
have used a CollapsiblePanelExtender on my page.It works fine in IE but when I open it in chrome. It doesn't show contents inside CollapsiblePanelExtender. I am using ajax toolkit with asp.net 3.5
View 4 RepliesI have a Collapsiblepanelextender and a TabContainer with two tabs. the code works fine in FF and Chrome but fails in IE8. I am using VS2008 .Net 3.5 and the latest AjaxToolkit.
I am trying to control the collapsible behavior through tab clicking using javascript. here is the code to replicate my problem.
The aspx.cs code:
[Code]....
I have several CollapsiblePanelExtenders in my formview (both EditTemplate and ItemTemplate). Everything works great, except that they always expand when I move from record to record. I'd like them to keep their previous state (collapsed or expanded). How can I do this with the Formview? Outside the Formview.
View 6 RepliesI have this CollapsiblePanelExtender (below) the problem is that in firefox it gives a horizontal scroll bar under the control which has to expand.
[Code]....
Below is the generated HTML
[Code]....
If I remove the "overflow-y:hidden" from the generated div then the scroll bar goes away, which is what I want....
I have a page which consists of a CollapsiblePanelExtender. To be specific, I have placed all my controls inside a panel and specified the TargetcontrolID as this panel and this is working perfect..Now, I just included a ModalPopupExtender control in the same page and specified the PopUpControlID as this same panel. Query1: Can CollapsiblePanelExtender and ModalPopupExtender work together?
I have also specified the CSS for the panel and for ModalPopupExtender. Have attached a part of the aspx page below.
[Code]....
I've read in a few places that this should close a collapsible panel:
To open: cpe1.Collapsed = true; cpe1.ClientState = "true";
To close: cpe1.Collapsed = false; cpe1.ClientState = "false";
But it doesn't seem to work from me...
I have a CollapsiblePanelExtender, and although the attribute Collapsed="true", the content panel is initially expanded.
When I click on the associated Header Panel, the Header changes (some text and an image are changed), and the content panel remains expanded. However when I click on the header again, the header changes (back to initial state) but the content panel momentarily collapses and then expands again.
Furthermore, I decided to copy Joe Steigner's demonstration word-for-word, and I get exactly the same result as before!!
I have following code:
Main.aspx:
[Code]....
So here I just make my repeater and put a custom control in it.
Message.aspx:
<asp:Panel ID="CommentsPanel" runat="server">
I have a page with two CollapsiblePanelExtender controls on it. The page is a multi-stage process which posts back to itself several times as the user steps through the process. All the page controls, includung the CollapsiblePanelExtenders are in an update panel and the page is derived from a master page.
When the page first loads, the CollapsiblePanelExtenders don't work properly - an open one will close on clicking, as epxected, but they only re-open intermittently and quickly reach a state where they won't re-open at all. However, once a user has initiated a postback by clicking on a form button, they work fine from there on in.
I can't work out what's causing this problem. Simply making the form post back to itself on load doesn't do anything, and neither does running the code that's initiated by the button click. I found - quite by accident - that inserting a StartupScript with an error (any error at all - just insert the the letter "a" in a script tag will do) into the page fixes the problem! But obviously that's not a satisfactory solution.
I have used CollapsiblePanelExtender in my web page. whenever I load the page I can see the panels open for a second and then they all close. I want to start the page with them closed.
View 3 RepliesI have one small issue with my page, i have two CollapsiblePanelExtender in my page and some required field validators are used for the textbox controls that are there within the CollapsiblePanelExtender.And i have also assigned two different validationgroups for all the validators.
Say if first validation group fails to validate then i want to expand the first CollapsiblePanelExtender1, similarly if second validation group fails then i want to expand second CollapsiblePanelExtender2.
I have a page that has a few controls inside a CollapsiblePanelExtender. What i need to do is save the state of the CollapsiblePanelExtender so that its easier for the user when they comeback to the page.
How would i go about saving the state of the CollapsiblePanelExtender to a cookie each time its expanded or collapsed?
If I have 5 CollapsiblePanelExtenders on page and I want open second one I want close the first one and then open second one...How??
View 2 Replies