Search Results

Search found 10 results on 1 pages for 'accordionpane'.

Page 1/1 | 1 

• How to determine which dijit.layout.AccordionPane is currently selected

  - by David Zhao

  Hi there, I tried to use "dijit.layout.AccordionPane.selected" to determine if any given AccordionPane is in focus (selected). However, AccordionPane.selected property will be set to "True" once the AccordionPane is selected, and AccordionPane.selected stays as "True" even other dijit.layout.AccordionPane is selected. So in other words, if I have 3 AccordionPanes, after I clicked on all 3 of them, AccordionPane.selected property for all 3 of them are "True" now. Is this a bug, or there is other ways to determine which AccordionPane is currently being selected (in focus)? Thanks in advance! David

  Read the article

• add ms ajax accordion pane at runtime loses previous pane issue

  - by Chris Conway

  I have an AjaxControlToolkit accordion control that i'm trying to load panes at runtime. When I click a button inside a listview, it should add a new pane to the accordion control. Here is the code that adds the pane in the onitemcommand event within the listview var pane = new AccordionPane { ID = key }; pane.HeaderContainer.Controls.Add(new LiteralControl(label.Text)); pane.ContentContainer.Controls.Add(LoadControl("~/UserControls/Covers/" + e.CommandArgument + ".ascx")); accordion.Panes.Add(pane); And this will successfully show a webcontrol inside the accordion control. But when I click on another button in the listview, the accordion is reset and it only shows the new pane instead of appending a new pane. Is there any way to keep the previous pane visible across postbacks like this? By the way, each of the webcontrols that are loaded in the accordion have input fields that will need to be persisted across postbacks as well. thanks!

  Read the article

• accordion pan with gridview

  - by Tarik

  i have gridview read first 3 current events from table i want to display each event in accordion pan

  Read the article

• Creando un Menu Accordeon con Ajax

  - by jaullo

  Ajax, es uno de los grandes componentes nacidos para utilizar en asp.net que brinda gran cantidad de funcionalidades y potencia nuestras aplicaciones, brindando sencilles y agilidad. Este post, esta dedicado a la creación de un menú tipo accordeon con ajax. Como bien sabemos, para poder utilizar cualquiera de los componentes ajax, es necesario que exista un scriptmanager registrado en nuestra página, el cual será el encargado de manejar nuestros controles. Entonces, lo primero que haremos será crear nuestro script manager.  <asp:ScriptManager ID="ScriptManager1" runat="server">     </asp:ScriptManager> Seguidamente definimos nuestro elemento accordeon y establecemos algunas de sus propiedades básicas:   <cc1:Accordion ID="AccordionCtrl" runat="server"         SelectedIndex="0" HeaderCssClass="accordionHeader"         ContentCssClass="accordionContent" AutoSize="None"         FadeTransitions="true" TransitionDuration="250"     FramesPerSecond="40" Para que nuestro accordeon funcione debemos declarar PANES dentro de el, estos panes serán los encargados de contener los elementos, vinculos o información que deseamos mostrar.   <Panes>                 <cc1:AccordionPane ID="AccordionPane0" runat="server">                     <Header>Matenimiento</Header>                     <Content>                         <li><a href="mypagina.aspx">My página de prueba</a></li>                                                                                          </Content>                 </cc1:AccordionPane> Como vemos podemos declarar tantos accordionPanes como queramos, cada accordionPane representa un elemento de categoría dentro del accordeon. Por útlimo debemos cerrar los elementos panel y accordion que abrirmos inicialmente.  </Panes>  </cc1:Accordion> Nuesto ejemplo finalmente completo debería verse así: <asp:ScriptManager ID="ScriptManager1" runat="server">     </asp:ScriptManager>         <cc1:Accordion ID="AccordionCtrl" runat="server"         SelectedIndex="0" HeaderCssClass="accordionHeader"         ContentCssClass="accordionContent" AutoSize="None"         FadeTransitions="true" TransitionDuration="250"     FramesPerSecond="40" >             <Panes>                 <cc1:AccordionPane ID="AccordionPane0" runat="server">                     <Header>Matenimiento</Header>                     <Content>                         <li><a href="mypagina.aspx">My página de prueba</a></li>                                                                                          </Content>                 </cc1:AccordionPane>                                                             </Panes>         </cc1:Accordion>         De esta forma, nuestro Menu tipo accordeon debería estar funcionando, una forma sencilla y agil de crear un menú en asp.net con Ajax.

  Read the article

• My ASP.NET Accordion will not animate panel changes when triggered by check boxes.

  - by CowKingDeluxe

  My accordion panel in markup: <ajaxToolkit:Accordion ID="MyAccordion" runat="server" SelectedIndex="0" HeaderCssClass="accordionHeader" HeaderSelectedCssClass="accordionHeaderSelected" ContentCssClass="accordionContent" AutoSize="None" FadeTransitions="true" TransitionDuration="250" FramesPerSecond="40" RequireOpenedPane="false" SuppressHeaderPostbacks="true"> <Panes> <ajaxToolkit:AccordionPane ID="AccordionPane10" runat="server"> <Header>BBBBBBBBBB</Header> <Content> FFFFFFFF:<br /><br /> <table cellpadding="0" cellspacing="0" width="750"><tr><td width="450" class="verificationtdleft"> <asp:Image ID="step4_originalimage" runat="server" AlternateText="" /> </td><td width="300"> <asp:CheckBox ID="CB_Verification0" runat="server" AutoPostBack="true" /> Verify </td></tr> </table> </Content> </ajaxToolkit:AccordionPane> <ajaxToolkit:AccordionPane ID="AccordionPane11" runat="server"> <Header>GGGGGGGGG</Header> <Content> HHHHHHHHHH:<br /><br /> <table cellpadding="0" cellspacing="0" width="750"><tr><td width="450" class="verificationtdleft"> <asp:Image ID="step4_image_thumbnail" runat="server" AlternateText="" /> </td><td width="300"> <asp:CheckBox ID="CB_Verification1" runat="server" AutoPostBack="true" /> Verify </td></tr> </table> </Content> </ajaxToolkit:AccordionPane> </Panes> Here's how I handle the checkbox check: Private Sub CB_Verification0_CheckedChanged(ByVal sender As Object, ByVal e As System.EventArgs) Handles CB_Verification0.CheckedChanged MyAccordion.SelectedIndex = 1 End Sub I'm causing the panels to change correctly, it's just that they don't animate like they do when I click the headers. When I click the checkbox to change the panel, the panel just disappears instantly and the new one appears instantly, but I want it to be animated as if I clicked the headers. Is there a way to cause the animation to happen when force changing the visible panel?

  Read the article

• Creating an AJAX Accordion Menu

  - by jaullo

  Introduction Ajax is a powerful addition to asp.net that provides new functionality in a simple and agile  way This post is dedicated to creating a menu with ajax accordion type. About the Control The basic idea of this control, is to provide a serie of panels and show and hide information inside these panels. The use is very simple, we have to set each panel inside accordion control and give to each panel a Header and of course, we have to set the content of each panel.  To use accordion control, u need the ajax control toolkit. know the basic propertyes of accordion control:  Before start developing an accordion control, we have to know the basic properties for this control Other accordion propertyes  FramesPerSecond - Number of frames per second used in the transition animations RequireOpenedPane - Prevent closing the currently opened pane when its header is clicked (which ensures one pane is always open). The default value is true. SuppressHeaderPostbacks - Prevent the client-side click handlers of elements inside a header from firing (this is especially useful when you want to include hyperlinks in your headers for accessibility) DataSource - The data source to use. DataBind() must be called. DataSourceID - The ID of the data source to use. DataMember - The member to bind to when using a DataSourceID  AJAX Accordion Control Extender DataSource  The Accordion Control extender of AJAX Control toolkit can also be used as DataBound control. You can bind the data retrieved from the database to the Accordion control. Accordion Control consists of properties such as DataSource and DataSourceID (we can se it above) that can be used to bind the data. HeaderTemplate can used to display the header or title for the pane generated by the Accordion control, a click on which will open or close the ContentTemplate generated by binding the data with Accordion extender. When DataSource is passed to the Accordion control, also use the DataBind method to bind the data. The Accordion control bound with data auto generates the expand/collapse panes along with their headers.  This code represents the basic steps to bind the Accordion to a Datasource Collapse Public Sub getCategories() Dim sqlConn As New SqlConnection(conString) sqlConn.Open() Dim sqlSelect As New SqlCommand("SELECT * FROM Categories", sqlConn) sqlSelect.CommandType = System.Data.CommandType.Text Dim sqlAdapter As New SqlDataAdapter(sqlSelect) Dim myDataset As New DataSet() sqlAdapter.Fill(myDataset) sqlConn.Close() Accordion1.DataSource = myDataset.Tables(0).DefaultView Accordion1.DataBind()End Sub Protected Sub Accordion1_ItemDataBound(sender As Object, _ e As AjaxControlToolkit.AccordionItemEventArgs) If e.ItemType = AjaxControlToolkit.AccordionItemType.Content Then Dim sqlConn As New SqlConnection(conString) sqlConn.Open() Dim sqlSelect As New SqlCommand("SELECT productName " & _ "FROM Products where categoryID = '" + _ DirectCast(e.AccordionItem.FindControl("txt_categoryID"),_ HiddenField).Value + "'", sqlConn) sqlSelect.CommandType = System.Data.CommandType.Text Dim sqlAdapter As New SqlDataAdapter(sqlSelect) Dim myDataset As New DataSet() sqlAdapter.Fill(myDataset) sqlConn.Close() Dim grd As New GridView() grd = DirectCast(e.AccordionItem.FindControl("GridView1"), GridView) grd.DataSource = myDataset grd.DataBind() End If End Sub In the above code, we made two things, first, we made a sql select to database to retrieve all data from categories table, this data will be used to set the header and columns of the accordion.  Collapse <asp:ScriptManager ID="ScriptManager1" runat="server"> </asp:ScriptManager> <ajaxToolkit:Accordion ID="Accordion1" runat="server" TransitionDuration="100" FramesPerSecond="200" FadeTransitions="true" RequireOpenedPane="false" OnItemDataBound="Accordion1_ItemDataBound" ContentCssClass="acc-content" HeaderCssClass="acc-header" HeaderSelectedCssClass="acc-selected"> <HeaderTemplate> <%#DataBinder.Eval(Container.DataItem,"categoryName") %> </HeaderTemplate> <ContentTemplate> <asp:HiddenField ID="txt_categoryID" runat="server" Value='<%#DataBinder.Eval(Container.DataItem,"categoryID") %>' /> <asp:GridView ID="GridView1" runat="server" RowStyle-BackColor="#ededed" RowStyle-HorizontalAlign="Left" AutoGenerateColumns="false" GridLines="None" CellPadding="2" CellSpacing="2" Width="300px"> <Columns> <asp:TemplateField HeaderStyle-HorizontalAlign="Left" HeaderText="Product Name" HeaderStyle-BackColor="#d1d1d1" HeaderStyle-ForeColor="#777777"> <ItemTemplate> <%#DataBinder.Eval(Container.DataItem,"productName") %> </ItemTemplate> </asp:TemplateField> </Columns> </asp:GridView> </ContentTemplate> </ajaxToolkit:Accordion>  Here, we use <%#DataBinder.Eval(Container.DataItem,"categoryName") %> to bind accordion header with categoryName, so we made on header for each element found on database.    Creating a basic accordion control As we know, to use any of the ajax components, there must be a registered ScriptManager on our site, which will be responsible for managing our controls. So the first thing we will do is create our script manager.     Collapse <asp:ScriptManager ID="ScriptManager1" runat="server"></asp:ScriptManager> Then we define our accordion  element and establish some basic properties:    Collapse <cc1:Accordion ID="AccordionCtrl" runat="server" SelectedIndex="0" HeaderCssClass="accordionHeader" ContentCssClass="accordionContent" AutoSize="None" FadeTransitions="true" TransitionDuration="250" FramesPerSecond="40" For our work we must declare PANES accordion inside it, these breads will be responsible for contain information, links or information that we want to show.  Collapse <Panes> <cc1:AccordionPane ID="AccordionPane0" runat="server"> <Header>Matenimiento</Header> <Content> <li><a href="mypagina.aspx">My página de prueba</a></li> </Content> </cc1:AccordionPane> To end this work, we have to close all panels and our accordion Collapse </Panes> </cc1:Accordion> Finally complete our example should look like:  Collapse <asp:ScriptManager ID="ScriptManager1" runat="server"></asp:ScriptManager> <cc1:Accordion ID="AccordionCtrl" runat="server" SelectedIndex="0" HeaderCssClass="accordionHeader" ContentCssClass="accordionContent" AutoSize="None" FadeTransitions="true" TransitionDuration="250" FramesPerSecond="40"> <Panes> <cc1:AccordionPane ID="AccordionPane0" runat="server"> <Header>Matenimiento</Header> <Content> <li><a href="mypagina.aspx">My página de prueba</a></li> </Content> </cc1:AccordionPane> </Panes> </cc1:Accordion>

  Read the article

• Can't Change The Content of a Ajax Control After CallBack

  - by Kubi

  public void RaiseCallbackEvent(String eventArgument) { // Processes a callback event on the server using the event // argument from the client. //Response.Write(eventArgument); printAlternativesFromAirport(eventArgument); } public void printAlternativesFromAirport(string airport) { List<TravelPlan> alternatives = fit.Code.TextDataHelper.GetAllTravelPlansFromCity(airport); AlternativesAcc.Panes.Clear(); AjaxControlToolkit.AccordionPane p = new AjaxControlToolkit.AccordionPane(); Label header = new Label(); header.Text = airport; Label content = new Label(); content.Text = airport; p.HeaderContainer.Controls.Add(header); p.ContentContainer.Controls.Add(content); AlternativesAcc.Panes.Add(p); ... Hi, printAlternativesFromAirport method should change an accordion panel after the callback but it doesn't. Is there anything that i could set to fix this problem ? There should be stg with the page lifecycle but i can't figure it out ! Thanks

  Read the article

• Programmatically controlling a Dojo Accordion

  - by prule

  I have a dijit.layout.AccordionContainer on my page which is defined in the html and created when dojo parses the page on load. Then, as the user interacts with the page I use Ajax to retrieve data and programmatically populate the container (removing existing items first). To illustrate my issue simply, here is some code that doesn't work: function doit() { var accordion = dijit.byId("accordionShell"); accordion.getChildren().each(function(item) { accordion.removeChild(item); }); for (i = 1; i < 5; i++) { var d = new dijit.layout.AccordionPane({title:'hello', content:'world'}); accordion.addChild(d); } } This fails, because only the first item in the accordian is visible. I think the others actually exist, but they are not visible so you can't do anything. I've managed to get around it by: Always ensuring there is 1 item in the accordian (so I never remove the first child) Call accordian.layout() after changing the contents So, this code "works" as long as you always want to see the first item, and don't actually expand any but the first one: function doit() { var accordion = dijit.byId("accordionShell"); var i = 0; accordion.getChildren().each(function(item) { if (i > 0) accordion.removeChild(item); i++; }); for (i = 1; i < 5; i++) { var d = new dijit.layout.AccordionPane({title:'hello', content:'world'}); accordion.addChild(d); } accordion.layout(); } I am using Dojo 1.2.0 - Anyone know what I am doing wrong?

  Read the article

• ajaxToolkit:Accordion vertical scrollbar on Pane

  - by nCdy

  <ajaxToolkit:Accordion ID="acc" runat="server"> <Panes> <ajaxToolkit:AccordionPane ID="pane1" runat="server"> <Header> <span>&#1047;&#1072;&#1087;&#1088;&#1086;&#1089;</span> </Header> <Content> <asp:Panel ID="controlGrid" runat="server" Height="170px"> and It every time makes Vertical scrollbar there even with empty space after Panel on Content. How to disable vertical scrollbar and empty space after panel inside 'Content' section ?

  Read the article

• ASP.NET make a panel visible on click of hyperlink (whilst also cuasing postback for page navigation

  - by Helen

  I may be asking the impossible but let me set out my problem: I have a menu in a MasterPage which uses images and mouseover mouseout events for design purposes. On one of the menu options I need to display a set of sub menus options on the click of the parent menu item. The menu item itself also needs to navigate to a specified url. I was originally trying to use an AJAX accordion panel but as I only had one accordion panel it was always displaying the sub menu items and was not collapsing. I have also tried putting the options in a div and setting the display via javascript. This worked but then was overwritten once the page navigation postback occurred. Here is the source: <%@ Master Language="VB" CodeFile="MasterPage.master.vb" Inherits="MasterPage" %> <%@ Register Assembly="AjaxControlToolkit" Namespace="AjaxControlToolkit" TagPrefix="cc1" %> <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <%@ Register Src="LeadHeader.ascx" TagName="LeadHeader" TagPrefix="uc1" %> <%@ Register Src="~/LeadFooter.ascx" TagName="LeadFooter" TagPrefix="uc2" %> <html xmlns="http://www.w3.org/1999/xhtml"> <head runat="server"> <link href="StyleSheet.css" rel="stylesheet" type="text/css" /> <script type="text/javascript"> var revert = new Array(); var inames = new Array('home', 'whoweare', 'whatwedo','ourapproach', 'ourvalues', 'contact'); // Preload if (document.images) { var flipped = new Array(); for(i=0; i< inames.length; i++) { flipped[i] = new Image(); flipped[i].src = "images/"+inames[i]+"2.jpg"; } } function over(num) { if(document.images) { revert[num] = document.images[inames[num]].src; document.images[inames[num]].src = flipped[num].src; } } function out(num) { if(document.images) document.images[inames[num]].src = revert[num]; } function ShowHide(elementId) { var element = document.getElementById(elementId); if(element.style.display != "block") { element.style.display = "block"; } else { element.style.display = "none"; } } function UpdateText(element) { if(element.innerHTML.indexOf("Show") != -1) { element.innerHTML = "Hide Details"; } else { element.innerHTML = "Show Details"; } } </script> </head> <body> <form id="form1" runat="server"> <div> <asp:ContentPlaceHolder ID="ContentPlaceHolder2" runat="server"> <uc1:LeadHeader ID="LeadHeader" runat="server" /> </asp:ContentPlaceHolder> <div id="nav"> <div class="menu-item"> <a href="Default.aspx"> <img src="Images/home.jpg" alt="home" id="home" onmouseover="over(0)" onmouseout="out(0)" class="right" /></a> </div> <div class="menu-item"> <a href="AboutUs.aspx"> <img src="Images/whoweare.jpg" alt="who we are" id="whoweare" onmouseover="over(1)" onmouseout="out(1)" class="right" /></a> </div> <%-- <asp:ScriptManager ID="ScriptManager1" runat="server"> </asp:ScriptManager> <cc1:Accordion ID="Accordion1" runat="server" AutoSize="None" FadeTransitions="true" TransitionDuration="350" FramesPerSecond="40" RequireOpenedPane="false" > <Panes> <cc1:AccordionPane runat="server"> <Header>--%> <div class="menu-item"> <a href="WhatWeDo.aspx"> <img src="Images/whatwedo.jpg" alt="what we do" id="whatwedo" onmouseover="over(2)" onmouseout="out(2)" class="right" onclick="ShowHide('divDetails');UpdateText(this);" /></a></div> <%--/Header> <Content>--%> <div id="divDetails" style="display:none;"> <a href="management.aspx" title="Management Development">Management Development</a><br /> <a href="leadership.aspx" title="Leadership Development">Leadership Development</a><br /> <a href="personal.aspx" title="Personal Development">Personal Development</a><br /> <a href="realteams.aspx" title="Team Building / Facilitation">Team Building & Facilitation</a><br /> <a href="coaching.aspx" title="Coaching">One to One Coaching</a> </div> <%-- </Content> </cc1:AccordionPane> </Panes> </cc1:Accordion> --%> <div class="menu-item"> <a href="OurApproach.aspx"> <img src="images/ourapproach.jpg" alt="our approach" id="ourapproach" onmouseover="over(3)" onmouseout="out(3)" /></a> </div> <div class="menu-item"> <a href="OurValues.aspx"> <img src="images/ourvalues.jpg" alt="our values" id="ourvalues" onmouseover="over(4)" onmouseout="out(4)" /></a> </div> <div class="menu-item"> <a href="ContactUs.aspx"> <img src="images/ContactUs.jpg" alt="contact us" id="contactus" onmouseover="over(5)" onmouseout="out(5)" /></a> </div> </div> <asp:ContentPlaceHolder ID="ContentPlaceHolder1" runat="server"> </asp:ContentPlaceHolder> <asp:ContentPlaceHolder ID="ContentPlaceHolder3" runat="server"> <uc2:LeadFooter ID="LeadFooter" runat="server" /> </asp:ContentPlaceHolder> </div> </form> </body> </html>

  Read the article

1