Solved

Ajax collapsible panel not collapsing

Posted on 2010-08-31
7
950 Views
Last Modified: 2013-11-07
I have a serie of collapsible panels in a form, that are collapsed when the form is first open.
I have added a link button to collapse or open the panels.  But for some reason I cannot make the panels collapse or open.

This is the code in my link button:
Protected Sub btnColPanel_Click(ByVal sender As Object, ByVal e As System.EventArgs) Handles btnColPanel.Click
        NVar.bCollapsed = Not NVar.bCollapsed

        If NVar.bCollapsed = True Then
            Me.btnColPanel.Text = "Display assessment information"
            Me.ColApp.Collapsed = True
            Me.ColSaving.Collapsed = True
            Me.ColCE.Collapsed = True
        Else
            Me.btnColPanel.Text = "Hide assessment information"
            Me.ColApp.Collapsed = False
            Me.ColCE.Collapsed = False
            Me.ColSaving.Collapsed = False
        End If
    End Sub
I have tried to set the Causevalidation of the button to true or false, it did not work.
I have moved the second part of the code where the (panel collapsed) to the init, load and prerender of the form, it did not work.

Thanks for your help.

Anne
0
Comment
Question by:AnneF
[X]
Welcome to Experts Exchange

Add your voice to the tech community where 5M+ people just like you are talking about what matters.

  • Help others & share knowledge
  • Earn cash & points
  • Learn & ask questions
  • 4
  • 2
7 Comments
 
LVL 6

Expert Comment

by:thaytu888888
ID: 33565232
- Can you debug and tell me what's happen?
0
 

Author Comment

by:AnneF
ID: 33566604
It looks like it go through the code only once, and the variable changes everytime, the name of the button changes as well but the panel does not collapse/open.
I have difficulty to debug since I have started using the ajax controls as I get the following message:
There is no source code available for the current location, and a button to show disassembly.
0
 
LVL 15

Expert Comment

by:rajeeshmca
ID: 33573906
Hello Annef,

Can u please let me know why do u want to do it in the code behind...

why dont u do somethig like the following:

<form id="form1" runat="server">
    <asp:ScriptManager ID="Sc1" runat="server"></asp:ScriptManager>
        <div>
            <asp:LinkButton ID="Lb1" runat="server" Text="Open" >
            </asp:LinkButton>
            <asp:Panel ID="Panel1" runat="server">
            Panel1
            </asp:Panel>
            <cc1:CollapsiblePanelExtender ID="TestColl1" runat="server" TargetControlID="Panel1" CollapseControlID="Lb1" ExpandControlID="Lb1"
            Collapsed="false"  >
            </cc1:CollapsiblePanelExtender>
            <asp:Panel ID="Panel2" runat="server">
            Panel2
            </asp:Panel>
            <cc1:CollapsiblePanelExtender ID="CollapsiblePanelExtender1" runat="server" TargetControlID="Panel2" CollapseControlID="Lb1" ExpandControlID="Lb1"
            Collapsed="false"  >
            </cc1:CollapsiblePanelExtender>
        </div>
    </form>

0
[Live Webinar] The Cloud Skills Gap

As Cloud technologies come of age, business leaders grapple with the impact it has on their team's skills and the gap associated with the use of a cloud platform.

Join experts from 451 Research and Concerto Cloud Services on July 27th where we will examine fact and fiction.

 

Author Comment

by:AnneF
ID: 33582344
I copied your code into a test form, however it does not recognise the asp:ScriptManager, message is: script manager is not a known element.

This is the html code I have:
<%@ Page Language="VB" AutoEventWireup="false" CodeFile="Test.aspx.vb" Inherits="Test_Panel_Test" %>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

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

<html xmlns="http://www.w3.org/1999/xhtml" >
<head runat="server">
    <title>Untitled Page</title>
</head>
<body>

<form id="form2" runat="server">

    <asp:ScriptManager ID="Sc1" runat="server"/>
        <div>
            <asp:LinkButton ID="Lb1" runat="server" Text="Open" >
            </asp:LinkButton>
            <asp:Panel ID="Panel1" runat="server">
            Panel1
            </asp:Panel>
            <ajaxToolkit:CollapsiblePanelExtender ID="TestColl1" runat="server" TargetControlID="Panel1" CollapseControlID="Lb1" ExpandControlID="Lb1"
            Collapsed="false"  >
            </ajaxToolkit:CollapsiblePanelExtender>
            <asp:Panel ID="Panel2" runat="server">
            Panel2
            </asp:Panel>
            <ajaxToolkit:CollapsiblePanelExtender ID="CollapsiblePanelExtender1" runat="server" TargetControlID="Panel2" CollapseControlID="Lb1" ExpandControlID="Lb1"
            Collapsed="false"  >
            </ajaxToolkit:CollapsiblePanelExtender>
        </div>
    </form>

</body>
</html>
0
 

Author Comment

by:AnneF
ID: 33582486
I managed to make the scriptmanager work, and I was able to test your solution, and it worked.

However, I have many collapsible panels, that can be open or closed separately. I want to be able to close/open them one a a time, when entering/viewing data, or all together at once.

In this case, your solution won't work for me, as the CollapseControlID and ExpandControlID is the link button at the top, so I won't be able to close/open one at a time.

Thanks for helping me finding a solution.
Anne
0
 
LVL 15

Accepted Solution

by:
rajeeshmca earned 500 total points
ID: 33584047
Hello try with the following sample

aspx page
-----------

<form id="form1" runat="server">
        <asp:ScriptManager ID="Sc1" runat="server">
        </asp:ScriptManager>
        <div>
            <table style="white-space: nowrap;">
                <tr>
                    <td style="text-indent;" abbr>
                    </td>
                </tr>
            </table>
            <asp:LinkButton ID="Lb1" runat="server" Text="Open">
            </asp:LinkButton>
            <asp:Panel ID="Panel1" runat="server">
                Panel1
            </asp:Panel>
            <cc1:CollapsiblePanelExtender ID="TestColl1" runat="server" TargetControlID="Panel1"
                CollapseControlID="Dummy" ExpandControlID="Dummy" Collapsed="false">
            </cc1:CollapsiblePanelExtender>
            <asp:Panel ID="Panel2" runat="server">
                Panel2
            </asp:Panel>
            <cc1:CollapsiblePanelExtender ID="CollapsiblePanelExtender1" runat="server" TargetControlID="Panel2"
                CollapseControlID="Dummy" ExpandControlID="Dummy" Collapsed="false">
            </cc1:CollapsiblePanelExtender>
            <input type="button" id="Dummy" runat="server" style="display: none;" />
        </div>
    </form>

.vb page
-----------

Protected Sub Lb1_Click(ByVal sender As Object, ByVal e As System.EventArgs) Handles Lb1.Click

        If TestColl1.Collapsed = False Then
            TestColl1.Collapsed = True
            Me.TestColl1.ClientState = "false"
            CollapsiblePanelExtender1.Collapsed = False
            Me.CollapsiblePanelExtender1.ClientState = "true"
        Else
            TestColl1.Collapsed = False
            Me.TestColl1.ClientState = "true"
            CollapsiblePanelExtender1.Collapsed = True
            Me.CollapsiblePanelExtender1.ClientState = "false"
        End If
       

    End Sub
0
 

Author Closing Comment

by:AnneF
ID: 33592361
Thank you very much for your help
0

Featured Post

More Than Just A Video Library

Train for your certification. Learn the latest DevOps tools. Grow your skillset to do better work.

At Linux Academy, we release new training modules every week so you'll always be up to date on the latest tech.

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

More often than not, we developers are confronted with a need: a need to make some kind of magic happen via code. Whether it is for a client, for the boss, or for our own personal projects, the need must be satisfied. Most of the time, the Framework…
This article discusses how to implement server side field validation and display customized error messages to the client.
In this brief tutorial Pawel from AdRem Software explains how you can quickly find out which services are running on your network, or what are the IP addresses of servers responsible for each service. Software used is freeware NetCrunch Tools (https…
This is my first video review of Microsoft Bookings, I will be doing a part two with a bit more information, but wanted to get this out to you folks.

624 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question