Dynamic Accordion

Hi --
I would like to build an accordion by iterating through a
record set and
create the open and close tags for the accordion based on a
value in my
database. However, when I try using the
<cfif>/<cfelse> tags with
<cfformgroup> inside I get an error because I have my
</cfformgroup> before
the <cfformgroup>
Below is my current code:
<cfform name="frmMainMenu" format="flash">
<cfformgroup type="accordion">
<cfoutput query="qryMenu">
<cfif #LINK# eq ''>
<cfformgroup type="page" label="#DESCRIPTION#"
name="page#ID#"/>
<cfelse>
<cfinput name="btn#ID#" type="button"
value="#DESCRIPTION#">
</cfif>
</cfoutput>
</cfformgroup>
</cfform>
As you can see I have the CFFORMGROUP self closing at the
moment. What I
want to do is this
if (link = "")
close the open CFFORMGROUP (if open)
open the next CFFORMGROUP
else
display a button inside the CFFORMGROUP
I would set a variable prior to the first record to not close
the
cfformgroup since none is open and then I would have a
cfformgroup closed at
the end of my loop.
Can anyone help me out here?
Thanks
Rich

I figured it out in case anyone else wanted to know..
<cfquery name="qryMenu" datasource="cfWebHotel">
SELECT *
FROM dbo.tableNewMenu
ORDER BY ID ASC
</cfquery>
<cfform format="flash" name="myForm"
onload="onLoadForm();" width="210">
<cfformitem type="script">
import mx.core.View;
import mx.containers.*;
import mx.controls.Button;
function onLoadForm() {
var top = 1;
<cfoutput query="qryMenu">
<cfif #LINK# is ''>
var child_obj = my_acc.createChild(Canvas, "inst#ID#",
{label:"#DESCRIPTION#"});
top = 1;
<cfelse>
var menuButton:Object = child_obj.createChild(Button,
"btn#ID#", {_x:1,
_y:top, width:180, label:"#DESCRIPTION#"});
top = top + 22;
</cfif>
</cfoutput>
</cfformitem>
<cfformgroup type="accordion" id="my_acc" width="184">
</cfformgroup>
</cfform>
"Rich Morey" <[email protected]> wrote in message
news:[email protected]...
> Hi --
>
> I would like to build an accordion by iterating through
a record set and
> create the open and close tags for the accordion based
on a value in my
> database. However, when I try using the
<cfif>/<cfelse> tags with
> <cfformgroup> inside I get an error because I have
my </cfformgroup>
> before the <cfformgroup>
>
> Below is my current code:
>
> <cfform name="frmMainMenu" format="flash">
> <cfformgroup type="accordion">
> <cfoutput query="qryMenu">
> <cfif #LINK# eq ''>
> <cfformgroup type="page" label="#DESCRIPTION#"
name="page#ID#"/>
> <cfelse>
> <cfinput name="btn#ID#" type="button"
value="#DESCRIPTION#">
> </cfif>
> </cfoutput>
> </cfformgroup>
> </cfform>
>
> As you can see I have the CFFORMGROUP self closing at
the moment. What I
> want to do is this
>
> if (link = "")
> close the open CFFORMGROUP (if open)
> open the next CFFORMGROUP
> else
> display a button inside the CFFORMGROUP
>
>
> I would set a variable prior to the first record to not
close the
> cfformgroup since none is open and then I would have a
cfformgroup closed
> at the end of my loop.
>
> Can anyone help me out here?
>
> Thanks
>
> Rich
>
>

Similar Messages

  • Spry:state and dynamic accordion

    When I use a dynamic accordion (i.e. populated by a dataSet),
    the accordion functionality disappears. Here is my code. Am I doing
    something wrong, or is this just a bug?
    Thanks
    Andy
    <div spry:region="dsOrders">
    <div spry:state="loading">Data is
    loading...</div>
    <div spry:state="error">Error loading
    data...</div>
    <div spry:state="ready">
    <div id="orders" class="Accordion">
    <div class="AccordionPanel" spry:repeat="dsOrders">
    <div class="AccordionPanelTab"><h3
    spry:content="{ORDERNUM}"></h3></div>
    <div class="AccordionPanelContent"><span
    spry:content="{ORDERDATE}"></span></div>
    </div>
    </div>
    </div>
    </div>

    This might also be helpful to some. Not only do we have
    states in SPRY... but events! Here is how I did it on a site that
    has a dataset called dsOpportunities. The following HTML/Javascript
    was added to the head tags of the HTML. Then the on <body
    onload="afterReady()" > was used to make sure it was run.
    Remember that your section you are hiding needs to have a class
    with the same senario. (Or if it is unique you could do something
    simular with ID rather than class.
    <script>
    function afterReady() {
    $('pageContent').style.visibility = 'hidden';
    var iSPRY = new Object;
    iSPRY.onPostLoad = function(dataSet,data) {
    $('pageContent').style.visibility = 'visible';
    dsOpportunities.addObserver(iSPRY);
    </script>
    <style>
    .pageContent {
    visibility: hidden;
    </style>

  • Dynamic accordion with dynamic datagrid

    I’m trying to create a dynamic accordion with embedded
    datagrids in each accordion area. I have the base working but have
    2 problems I can’t seem to figure out.
    Bases; the accordion uses a repeater and vbox with a custom
    component from a webservice result set to create the accordion. The
    custom component has another webservice that gets a value from the
    repeater to pass it to the custom component.
    My 2 problems:
    1. how do I prevent the custom component from running the
    webservice until the accordion item is clicked or the area is
    visible? Otherwise I end up will a bunch of queries hitting the DB
    and if there is several items for the accordion and many items from
    the datagrid its slower.
    2. how can I get the datagrid query to refresh when the
    accordion item is clicked? Because the data may change I am not
    able to see the updated data unless I reload the entire
    application.
    1 thing I did try. With the tab control you can use the
    show() event and the data will refresh just fine, but with the
    accordion, the show() event does not seem to fire. Its as if they
    are all visible.
    Any help here would be much appreciated, I’ve been
    racking my brain for days now and I sure it is something simple
    that I am missing. Thanks in advance.
    See the example code below.
    the application code:
    <?xml version="1.0" encoding="utf-8"?>
    <mx:Application xmlns:mx="
    http://www.adobe.com/2006/mxml"
    layout="absolute"
    width="100%"
    height="100%"
    initialize="ws.getMethod1.send()"
    xmlns:output="com.comp.*">
    <mx:Script>
    <![CDATA[
    import mx.controls.Alert;
    [Bindable]
    public var thisWsdl:String = '
    http://localhost/webservice/service.cfc?wsdl';
    ]]>
    </mx:Script>
    <mx:WebService id="ws"
    wsdl="{thisWsdl}"
    useProxy="false"
    showBusyCursor="true"
    fault="Alert.show(event.fault.faultString, 'Error');"
    concurrency="multiple" requestTimeout="30">
    <mx:operation name="getMethod1">
    <mx:request>
    <param1>{param1data}</param1>
    <param2>{param2data}</param2>
    <param3>{param3data}</param3>
    </mx:request>
    </mx:operation>
    </mx:WebService>
    <mx:Accordion width="100%" height="100%"
    fillColors="[#808080, #808080]">
    <mx:Repeater id="rp"
    dataProvider="{ws.getMethod1.lastResult}">
    <mx:VBox label="{String(rp.currentItem.catname)}"
    backgroundColor="#C0C0C0" width="100%" height="100%"
    paddingRight="10">
    <output:comp catid="{rp.currentItem.catid}"/>
    </mx:VBox>
    </mx:Repeater>
    </mx:Accordion>
    </mx:Application>
    the component code:
    <?xml version="1.0" encoding="utf-8"?>
    <mx:VBox xmlns:mx="
    http://www.adobe.com/2006/mxml"
    width="100%"
    height="100%"
    focusIn="ws.getMethod.send()"
    horizontalAlign="center"
    backgroundColor="#FFFFFF">
    <mx:Script>
    <![CDATA[
    import mx.controls.Alert;
    [Bindable]
    public var thisWsdl:String = '
    http://localhost/webservice/service.cfc?wsdl';
    [Bindable]
    public var catid:int;
    ]]>
    </mx:Script>
    <mx:WebService id="ws"
    wsdl="{thisWsdl}"
    useProxy="false"
    showBusyCursor="true"
    fault="Alert.show(event.fault.faultString, 'Error');"
    concurrency="multiple" requestTimeout="30">
    <mx:operation name="getMethod2">
    <mx:request>
    <catid>{catid}</catid>
    </mx:request>
    </mx:operation>
    </mx:WebService>
    <mx:DataGrid id="itemGrid"
    dataProvider="{ws.getMethod2.lastResult}" width="700"
    height="250">
    <mx:columns>
    <mx:DataGridColumn width="100" dataField="itemid"
    headerText="Item Id"/>
    <mx:DataGridColumn wordWrap="true" dataField="itemname"
    headerText="Item Name"/>
    </mx:columns>
    </mx:DataGrid>
    </mx:VBox>

    Perhaps you could use the change event of the accordion, or
    the show event of the child containers?
    Tracy

  • Dynamic Accordion 2-Levels deep

    Hello,
    I'm relatively new to FLEX and I am having a problem
    referencing a dynamically named UI object to add a child to.
    I am building a menu with an accordion, adding tab sections
    using the addChild method, and then trying to add link buttons
    within each tab section. No matter how I try to reference the
    dynamically named tab section, nothing seems to work....
    any help would be appreciated.
    A graphic of my layout can be viewed here to better
    understand the problem I am trying to solve.
    click here for
    graphic
    There are 3 panels and empty accordians (hardcoded in the
    mxml) ,
    I retrieve from a database a list of tabs I want to display,
    loop through and add to the accordian in which it belongs.
    This works up to this point and adds all the children
    correctly, but trying to add children (link buttons) to those newly
    added children (tab sections) is where I'm tripping up....
    my code follows;
    private function
    getSubCategoryTypes_ResultHandler(event:ResultEvent):void{
    acSubCategoryTypes = ArrayCollection(event.result);
    for ( var i:int=0; i < acSubCategoryTypes.length; i++ ) {
    var iPanel:int = acSubCategoryTypes
    .PanelSort;
    var iTab:int = acSubCategoryTypes.TabSort;
    var tabID:String = 'TB'+ iPanel + "-" + iTab;
    accordion_addChild(this['Ac'+ iPanel], acSubCategoryTypes
    .TabTitle, tabID)
    private function accordion_addChild(accordion:Accordion,
    childTitle:String, tabID:String):void{
    var vbox:VBox = new VBox();
    vbox.label = childTitle;
    vbox.id = tabID;
    vbox.percentWidth = 100;
    vbox.percentHeight = 100;
    accordion.addChild(vbox);
    // this is where I call the function to get the list of links
    I want to populate the accordian sections with.
    createLinks(childTitle); //
    private function createLinks(tabName:String):void {
    RO_SecurityMenu.getLinkList(tabName);
    private function
    getLinkList_ResultHandler(event:ResultEvent):void{
    acLinkItems = ArrayCollection(event.result);
    for (var i:int=0; i < acLinkItems.length; i++ ) {
    var urlPath:String = acLinkItems.URL;
    var linkLabel:String = acLinkItems
    .Descr;
    var iPanel:int = acLinkItems.PanelSort;
    var iTab:int = acLinkItems
    .TabSort;
    // but I cannot seem to reference it correctly when it is
    dynamically named.
    var vbox:VBox = this['TB'+ iPanel + "-" + iTab];
    var linkButton:LinkButton = new LinkButton ();
    linkButton.label = linkLabel;
    linkButton.id = linkLabel;
    linkButton.data = urlPath;
    linkButton.addEventListener(MouseEvent.CLICK,
    application.followLink);
    // if I hardcode this line to a hardcoded accordian tab
    section it works.....
    vbox.addChild(linkButton);
    I have been pulling my hair out trying to get this to work...
    I don't have much left!!!
    Any help would be appreciated greatly!!
    Thanks,
    Kevin

    I was able to achieve this using a different method;
    1. Returning XML instead of a query object from my remote
    object.
    2. Loop through the XML nodes using nested repeaters hard
    coded in the mxml.
    code follows;
    <mx:Panel width="100%" height="33%" layout="vertical"
    id="panel1" title="">
    <mx:Accordion id="Ac1" width="100%" height="100%" >
    <mx:Repeater id="repeatAc1" dataProvider="{MenuXML.tab}"
    >
    <mx:VBox width="100%" height="100%"
    label="{repeatAc1.currentItem.label}" >
    <mx:Repeater id="repeatlinkAc1"
    dataProvider="{repeatAc1.currentItem.link}" >
    <mx:LinkButton label="{repeatlinkAc1.currentItem.label}"
    data="{repeatlinkAc1.currentItem.url}" click="followLink(event)"
    />
    </mx:Repeater>
    </mx:VBox>
    </mx:Repeater>
    </mx:Accordion>
    </mx:Panel>
    this is a sample of the XML data I'm returning from the
    remote object;
    <panel>
    <panelID>3</panelID>
    <tab>
    <label>Fund - Portfolio Profile</label>
    <link>
    <label>Investor Information</label>
    <url>index.cfm?DocID=</url>
    </link>
    <link>
    <label>Subscription Lender Information</label>
    <url>index.cfm?DocID=</url>
    </link>
    </tab>
    <tab>
    <label>Legal Documents</label>
    <link>
    <label>Subscription Agreements</label>
    <url>index.cfm?DocID=</url>
    </link>
    <link>
    <label>Private Placement Memorandum</label>
    <url>index.cfm?DocID=</url>
    </link>
    <link>
    <label>Limited Partnership Agreement</label>
    <url>index.cfm?DocID=</url>
    </link>
    <link>
    <label>Amendments to LPA</label>
    <url>index.cfm?DocID=</url>
    </link>
    </tab>
    </panel>
    Thanks Kaotic101 for your help earlier!
    Kevin (Kdub)

  • Programmatic openPanels and Dynamic Accordion Content

    I have been trying to add links to programmatically open
    panels in my accordion, which is successfully populated with an XML
    dataset. It doesn't seem to work, (tried using both "simple
    navigation" and "panel index" links).
    This does work when the data in the accordion is hard-coded.
    I created a test page directly from the AccordionSample2 page
    in the samples with Spry 1.5 (all of my files are 1.5).
    I added the programmatic links to open each of the 2 methods
    of populating the accordion on that page, and they don't seem to
    work, either.
    Test Page is here:
    www.imagicdigital.com/spry/AccordionSample2test.html
    I thought perhaps the dynamically created accordion is using
    a different id, so that's why the programmatic linking doesn't
    work, but when I viewed the generated markup with the debugger, it
    appears to use the given id.
    Any thoughts or help? Thanks in advance.

    http://labs.adobe.com/technologies/spry/samples/utils/URLUtilsSample.html
    that might help u out. the bottom example is a tabbed widget
    that gets activated by clicking a link.
    and this;
    http://labs.adobe.com/technologies/spry/articles/data_api/apis/collapsible_panel.html#meth ods
    might help u out to.
    also, u might want to add the
    <script type="text/javascript">
    var a1 = new Spry.Widget.Accordion("Acc2");
    </script>
    part, becouse that is missing, and its giving errors. and if
    u have firebug installed u will see those errors on firefox.
    getfirefox.com <-- firefox
    getfirebug.com <-- firebug

  • Dynamic Accordion Children/Height Issue

    Hello,
    I am fairly new to flex, so this issue may actually be an easy fix, but please bare with me.
    I have an accordion in my project that is being populated with child canvas containers based on the result of a mysql_query from AMFPHP. Due to space limitations the accordion MUST remain the exact same size no matter how many records come back from my query. My problem is that when too many accordion child containers are generated they overlap on top of each other.
    Is there a way to turn a scrollbar on for the accordion? If not then is there a way to limit the number of child containers displayed inside the accordion and then control that with a VScrollbar?
    Thanks,
    Brian

    Wrap the Accordion in a VBox and you should be all set.
    <?xml version="1.0" encoding="utf-8"?>
    <mx:Application xmlns:mx="http://www.adobe.com/2006/mxml"
      creationComplete="init();">
      <mx:Script>
        <![CDATA[
          import mx.containers.VBox;
          private function init():void{
            for(var a:uint=0;a<100;a++){
              var vb:VBox = new VBox();
              vb.label = "MyVBox" + a;
              vb.width = 200;
              vb.height = 100;
              acc.addChild(vb);
        ]]>
      </mx:Script>
      <mx:HDividedBox width="100%" height="100%">
        <mx:VBox width="50%" height="100%"/>
        <mx:VDividedBox width="50%" height="100%">
          <mx:VBox width="100%" height="50%"/>
          <mx:VBox width="100%" height="50%">
            <mx:Accordion id="acc" width="100%" height="50%"/>     
          </mx:VBox>
        </mx:VDividedBox>
      </mx:HDividedBox>
    </mx:Application>
    If this post answers your question or helps, please mark it as such.
    Greg Lafrance - Flex 2 and 3 ACE certified
    www.ChikaraDev.com
    Flex / AIR Development, Training, and Support Services

  • Dynamic Accordion height (revisited)

    Hi All,
    I have an application that allows the user to add or remove
    Accordion panels at will. My problem is that I want to keep the
    overall Accordion height constant independent of the number of
    panels.
    I have found a simple way to keep the overall height of an
    Accordion constant by varying the AccordionPanelContent height as
    follows:
    <div class="AccordionPanelContent" style="height:
    expression(500-(20*{ds_RowCount})+'px'); margin: 0px;">
    The problem is that it only works in IE5+.
    Is there a way to achieve the same result for other browsers?

    quote:
    Originally posted by:
    Barascu Diana
    Hi,
    you can use expression () only for IE and if you want to get
    the same behavior for the other browsers, you should write some
    java script code to compute the height and then to set it on the
    element.
    Something like this:
    var el = document.getElementById('id_{ds_RowID}');
    if (el){
    el.style.height = 500 - (20 *
    (isNaN(parseInt('{ds_RowCount}'))? 0 : parseInt('{ds_RowCount}')))
    + 'px';
    Diana
    Hello Diana,
    Thank you very much for your quick response. I used your
    script and it and it works like a charm.
    Kind regards,
    Ben

  • Dynamic Accordion Menu

    Hi All,
    I'm using spry accordion as a menu loading its data from an
    XML file. Here is my code
    <!-- here I include all the libraries -->
    <script src="../SpryAssets/SpryAccordion.js"
    type="text/javascript"></script>
    <script src="../SpryAssets/xpath.js"
    type="text/javascript"></script>
    <script src="../SpryAssets/SpryData.js"
    type="text/javascript"></script>
    <script src="../SpryAssets/SpryDOMUtils.js"
    type="text/javascript"></script>
    <script src="../SpryAssets/SpryURLUtils.js"
    type="text/javascript"></script>
    <script type="text/javascript">
    // Grabs the values of the URL parameters for the current
    URL.
    var params = Spry.Utils.getLocationParamsAsObject();
    </script>
    <script type="text/javascript">
    var strategic1 = new
    Spry.Data.XMLDataSet("../xml/Strategic.xml", "NewDataSet/Content");
    var observer = { onPostUpdate: function(notifier, data) { var
    a2 = new Spry.Widget.Accordion("Accordion1" ,
    {defaultPanel:(params.panel ? params.panel : -1)}); } };
    Spry.Data.Region.addObserver("strategic1Region", observer);
    //-->
    </script>
    <!-- here I set the spry region -->
    <div id="strategic1Region" spry:region="strategic1">
    <div id="Accordion1" class="Accordion" tabindex="0">
    <!-- here I set the area to be repeated -->
    <div spry:repeat="strategic1" class="AccordionPanel">
    <div
    class="AccordionPanelTab">{strategic1::Menu}</div>
    <div class="AccordionPanelContent">
    <ul>
    <li spry:if=" '{strategic1::Link1}' != 'undefined' "
    class="SubMenu"><a href="{URL1}"
    class="SubMenu">{Link1}</a></li>
    <li spry:if=" '{strategic1::Link2}' != 'undefined' "
    class="SubMenu"><a href="{URL2}"
    class="SubMenu">{Link2}</a></li>
    <li spry:if=" '{strategic1::Link3}' != 'undefined' "
    class="SubMenu"><a href="{URL3}"
    class="SubMenu">{Link3}</a></li>
    <li spry:if=" '{strategic1::Link4}' != 'undefined' "
    class="SubMenu"><a href="{URL4}"
    class="SubMenu">{Link4}</a></li>
    <li spry:if=" '{strategic1::Link5}' != 'undefined' "
    class="SubMenu"><a href="{URL5}"
    class="SubMenu">{Link5}</a></li>
    </ul>
    </div>
    </div>
    </div>
    </div>
    </div>
    AND HERE IS MY XML FILE
    <Content>
    <IdMenu>2</IdMenu>
    <Menu>tab01</Menu>
    <SunMenu>SUB2</SunMenu>
    <Link1>link01</Link1>
    <Link2>link02</Link2>
    <Link3>link0303</Link3>
    <URL1>../link01.asp?panel=0#strategic</URL1>
    <URL2>../link02.asp?panel=0#strategic</URL2>
    <URL3>../link03.asp?panel=0#strategic</URL3>
    </Content>
    <Content>
    <IdMenu>3</IdMenu>
    <Menu>tab02</Menu>
    <SunMenu>SUB3</SunMenu>
    <Link1>link01</Link1>
    <Link2>link02</Link2>
    <Link3>link0303</Link3>
    <URL1>../link01.asp?panel=0#strategic</URL1>
    <URL2>../link02.asp?panel=0#strategic</URL2>
    <URL3>../link03.asp?panel=0#strategic</URL3>
    </Content>
    <Content>
    <IdMenu>4</IdMenu>
    <Menu>tab03</Menu>
    <SunMenu>SUB4</SunMenu>
    <Link1>link01</Link1>
    <Link2>link02</Link2>
    <Link3>link03</Link3>
    <Link4>link04</Link4>
    <Link5>link0303</Link5>
    <URL1>../link01.asp?panel=0#strategic</URL1>
    <URL2>../link02.asp?panel=0#strategic</URL2>
    <URL3>../link03.asp?panel=0#strategic</URL3>
    <URL4>../link04.asp?panel=0#strategic</URL4>
    <URL5>../link05.asp?panel=0#strategic</URL5>
    </Content>
    The Question
    Is there a way to get the number of childnodes from the XML
    file and load it to a var x and loop
    <li spry:if=" '{strategicx::Linkx}' != 'undefined' "
    class="SubMenu"><a href="{URLx}"
    class="SubMenu">{Linkx}</a></li>
    instead of repeating the spry:if 5 times
    <li spry:if=" '{strategic1::Link1}' != 'undefined' "
    class="SubMenu"><a href="{URL1}"
    class="SubMenu">{Link1}</a></li>
    <li spry:if=" '{strategic1::Link2}' != 'undefined' "
    class="SubMenu"><a href="{URL2}"
    class="SubMenu">{Link1}</a></li>
    <li spry:if=" '{strategic1::Link3}' != 'undefined' "
    class="SubMenu"><a href="{URL3}"
    class="SubMenu">{Link1}</a></li>
    <li spry:if=" '{strategic1::Link4}' != 'undefined' "
    class="SubMenu"><a href="{URL4}"
    class="SubMenu">{Link1}</a></li>
    <li spry:if=" '{strategic1::Link5}' != 'undefined' "
    class="SubMenu"><a href="{URL5}"
    class="SubMenu">{Link1}</a></li>

    Siva,
    My suggestion:
    1). Create a managed bean that contains nested java.util.List's or java.util.Array's that read the menu hierarchy from the database
    2). Use af:forEach tags inside of af:panelAccordion to iterate through the menu structure and stamp out the menu items.
    John

  • Dynamic Accordion, fetching node name instead of value. Is it possible?

    Here is the xml.
    <?xml-stylesheet type="text/xsl" href="myweb.xsl"?>
    <client product="ppd" date="4/26/11 3:17 AM">
    <system>
           <osname>Linux
              </osname>
           <hostname>abhishek
              </hostname>
           <release>2.6.18-128.el5
              </release>
           <version>Red Hat Enterprise Linux Server release 5.3 (Tikanga)
              </version>
           <machine>ia64
              </machine>
           <bitmode>64
              </bitmode>
           <filesystem>
              <file mount='Mounted' home='Filesystem' total='1K-blocks' free='Available' used='Used' percentage='Use%' />
              <file mount='/' home='/dev/sda3' total='60300484' free='38305668' used='18882312' percentage='34%' />
              <file mount='/boot/efi' home='/dev/sda1' total='1046516' free='1037912' used='8604' percentage='1%' />
              <file mount='/dev/shm' home='tmpfs' total='4120800' free='4120800' used='0' percentage='0%' />
           </filesystem>
    </system>
    </client>
    my spry region. Using {systemData::osname} I can point to "Linux" but instead I would like to get osname itself. So basically I want to make a tree like structure using accordion where data within tree comes from this xml's node names.
    <div spry:region="systemData">
    <div id="Accordion1" class="Accordion" tabindex="0">
    <div spry:repeat="systemData" class="AccordionPanel">
    <div class="AccordionPanelTab">{systemData::osname}</div>
    <div class="AccordionPanelContent">
    {systemData::hostname}
    </div>
    </div>
    </div>
    <script type="text/javascript">
    var a1 = new Spry.Widget.Accordion("Accordion1");
    </script>
    </div>
    last but not least here is my spry dataset
    var systemData=new Spry.Data.XMLDataSet("include/xml/clientabhishek.xml","client/system");

    hehe. Sorry for not being so clear. I wanted to know whether there is a way I can get osname(node name) instead of Linux (node value) from my dataset. Like using {osname} I can get value of osname but I was wondering if osname itself can be fetched someway. Is there a way? Thanks for passing by

  • Repeater and Accordion

    Hi..
    I am interested in creating a dynamic accordion based on XML
    data, such as
    is shown here
    http://www.powersdk.com/ted/2005/05/flex-example-accordion-repeater.php
    Unfortunately, the provided link to the source code at the
    bottom of the
    page is broken.
    Can anyone help me out? Basically I have a data list like
    this
    MENU A
    SUBA1
    SUBA2
    SUBA3
    MENUB
    SUBb1
    SUBB2
    SUBB3
    so I want an accordion tab for Menu A and Menu B and then the
    SUB's as
    buttons inside the appropriate accordion.
    Thanks
    Rich

    Well, I am partway there. I can't figure out how to reference
    the text nodes of the xml. I have put the date in a label attribute
    for testing for now. Give this a try and see if it is approaching
    what you want.
    Tracy
    <?xml version="1.0" encoding="utf-8"?>
    <!-- There is a bug in Repeater that prevents XMLList from
    being used as a dataProvider -->
    <mx:Application xmlns:mx="
    http://www.adobe.com/2006/mxml"
    layout="absolute"
    creationComplete="initApp()">
    <mx:Script><![CDATA[
    import mx.collections.ArrayCollection;
    [Bindable]
    private var _ArrayCollection:ArrayCollection = new
    ArrayCollection;
    private function initApp():void
    var xmlAccordion:XML =
    <root>
    <item label="A">ITEM A
    <subitem label="A1">SUBA1</subitem>
    <subitem label="A2">SUBA2</subitem>
    </item>
    <item label="B">ITEM B
    <subitem label="B1">SUBb1</subitem>
    <subitem label="B2">SUBB2</subitem>
    <subitem label="B3">SUBB3</subitem>
    </item>
    </root>
    var xl:XMLList = xmlAccordion.item;
    _ArrayCollection = convertArrayCollection(xl)
    }//initApp
    //Converts an XMLList into an ArrayCollection
    private function
    convertArrayCollection(xl:XMLList):ArrayCollection
    var ac:ArrayCollection = new ArrayCollection;
    for (var i:int=0;i<xl.length();i++) {
    ac.addItem(xl
    return ac;
    ]]></mx:Script>
    <mx:Accordion width="300">
    <mx:Repeater id="r" dataProvider="{_ArrayCollection}">
    <mx:HBox label="{r.currentItem.@label}" width="100%">
    <mx:Repeater id="rsub"
    dataProvider="{convertArrayCollection(r.currentItem.subitem)}">
    <mx:Button label="{rsub.currentItem.@label}" />
    </mx:Repeater>
    </mx:HBox>
    </mx:Repeater>
    </mx:Accordion>
    </mx:Application>

  • Accordéon Spry avec données dynamiques.

    Bonsoir.
    J'ai créé une base de données avec des news et je souhaiterais, à l'aide de Dreamweaver et la librairie Spry, réaliser un accordéon dynamique, affichant le titre de la new dans le bandeau cliquable, et le texte de la new dans le content. J'ai essayé de jouer avec les zones répétées mais je ne suis parvenu à rien. Quelqu'un peut-il me mettre sur la voie ? (je ne demande pas de solution toute faite bien sur, juste le chemin à suivre).
    Merci beaucoup d'avance.
    pmediag

    Personally I would not an accordion for this; but a master/detail area as I have done here http://pleysier.com.au/rss/
    But if you want to use a dynamic accordion, have a look here http://www.infoaccelerator.net/blog/post.cfm/spry-dynamic-panels-within-dynamic-accordions
    The first step is to create an XML file populated with data from the database, see here http://labs.adobe.com/technologies/spry/samples/utils/query2xml.html
    You can then create a SpryXMLDataSet to use for the accodrion.
    Gramps

  • ADF Jdeveloper Accordion Implementation

    Hi
    Could you please help in one of ADF accordion implementation.
    I have a requirement to implement accordions on page. The scenario could be best explain with example: Lets say I have 3 tables schools, students, subjects. School contain list of schools. for each school there are number of students stored in students table and each student can enroll number of subjects. So, when user login in on page, depending upon school-ID,
    for each student in that school there would be an accordion component say student1, student2, student3 etc.. number of students-accordion will be dynamic based on number of students in that school. When student1 accordion is clicked, it should show all the subjects that student has enrolled. Similarly if student2- accordion is clicked it should corresponding list of subjects for that student.
    Any inputs or pointers on dynamic accordion. One approach would be iterate on number of students and create accordion accordingly..not sure it will work..

    Hi,
    use an af:foEach as a child ofthe panelAccordion to iterate over a list of students. Within teh af:forEach component have a showDetailItem and within this, populate the student detail information. Using ADF, I would use a tree binding that shows all students and as child nodes the detail information
    Frank

  • Accordion menu problem. Doesn't move.

    Hello!
    Here are files I've modified.
    http://failiem.lv/u/jhqapxy
    I was making an accordion menu after this tutorial.
    http://www.thetechlabs.com/xml/build-a-dynamic-accordion-menu-in-flash-cs4-with-actionscri pt-30-and-xml/
    In basic tutorial there is extra part of button where you add menu name "home, about us" etc.
    But I don't need this. I needed more simplier. From xml file I load an image or swf. And then you just mouse over it and it moves and it clicks. No extra 30 pixels for button space.
    If i change AS line
    ldr.x=0
    to ldr.x=27
    then it moves, but there is extra unnecessary empty space between content things. I don't need it. What should I do?
    I'm total beginer at these things, but I really need this thing.

    You need to find where the space between is being added. If you include the relevant code in your posting you are more likely to get help.  Also, probiding screenshots to show the problem you want to solve can be helpful.
    People are generally not too keen about chancing downloading files and researching tutorials or other external information when trying to help in forums.

  • Spry Repeat Accordeon Panels

    This code here repeats the accordeons panel but all opened
    and innactive.
    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0
    Transitional//EN" "
    http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
    <html xmlns="
    http://www.w3.org/1999/xhtml">
    <head>
    <meta http-equiv="Content-Type" content="text/html;
    charset=iso-8859-1" />
    <title>Products Demo</title>
    <link href="css/accordion.css" rel="stylesheet"
    type="text/css" />
    <script type="text/javascript"
    src="../../includes/xpath.js"></script>
    <script type="text/javascript"
    src="../../includes/SpryData.js"></script>
    <script type="text/javascript"
    src="../includes/SpryEffects.js"></script>
    <script type="text/javascript"
    src="../includes/SpryAccordion.js"></script>
    <script type="text/javascript"
    src="../../includes/gallery.js"></script>
    <script type="text/javascript">
    var dsProducts = new Spry.Data.XMLDataSet("products.xml",
    "products/product")
    var dsProductFeatures = new
    Spry.Data.XMLDataSet("products.xml",
    "products/product/features/feature")
    </script>
    <link href="../css/screen.css" rel="stylesheet"
    type="text/css" />
    </head>
    <body>
    <div id="wrap">
    <div id="sidebar">
    <table spryregion="dsProductFeatures" id="products">
    <caption>
    {@Departure}
    </caption>
    </table>
    <div spryregion="dsProductFeatures" id="content">
    tetette
    <p>
    <img src="
    http://staticcontent.exitravel.com/StaticContent/EN/DBImages/Common/Image/Hotel/{@OrgID}/{ @HotelID}_1.jpg"
    id="mainImage" alt="main image" width="120" height="120" />
    </div>
    <div id="Acc1" class="Accordion">
    <div spryregion="dsProductFeatures"
    class="AccordionPanel">
    <div spryrepeat="dsProductFeatures">
    <div class="AccordionPanelLabel">
    {@Destination}
    </div>
    <div class="AccordionPanelContent">
    {@Price}
    </div>
    </div>
    </div>
    </div>
    </div>
    </div>
    <script type="text/javascript">
    <!--
    var Acc1 = new Spry.Widget.Accordion("Acc1");
    -->
    </script>
    </body>
    </html>
    Does that mean that Spry accordeons cant be duplicated that
    way?

    Actually, you can generate the panels dynamically, but there
    are a couple of things you have to keep in mind. There is an
    expected markup structure for the accordion. The divs that make up
    the accordion follow a pattern that looks like this:
    Accordion
    Accordion Panel
    Accordion Panel Label
    Accordion Panel Content
    Accordion Panel
    Accordion Panel Label
    Accordion Panel Content
    Inserting extra divs between and around some of these
    structures will only confuse the Accordion behavior code.
    Since you are trying to repeat accordion panels, you want to
    put the spryregion attribute on the Accordion itself, and then put
    a spryrepeat on the actual div that is the panel.
    The next thing to consider, is that anytime Spry regenerates
    the markup for a widget, you have to re-attach all of the widget
    behaviors to the widget. To accomplish this, we have to place a
    listener on the data set. The idea is that every time the data set
    notifies listeners that its data has changed, we know the widget
    markup will be re-generated, so we have to call the constructor for
    the Accordion.
    Here's some actual markup that I whipped up that works:
    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0
    Transitional//EN" "
    http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
    <html xmlns="
    http://www.w3.org/1999/xhtml">
    <head>
    <meta http-equiv="Content-Type" content="text/html;
    charset=iso-8859-1" />
    <title>Dynamic Accordion</title>
    <link href="../../css/accordion.css" rel="stylesheet"
    type="text/css" />
    <script language="JavaScript" type="text/javascript"
    src="../../includes/xpath.js"></script>
    <script language="JavaScript" type="text/javascript"
    src="../../includes/SpryData.js"></script>
    <script language="JavaScript" type="text/javascript"
    src="../../includes/SpryEffects.js"></script>
    <script language="JavaScript" type="text/javascript"
    src="../../includes/SpryAccordion.js"></script>
    <script language="JavaScript" type="text/javascript">
    // Step 1: Define the data set:
    var dsAirports = new
    Spry.Data.XMLDataSet("../../data/airports.xml",
    "/airports/airport");
    // Step 2: Register a listener on dsAirports so that we can
    auto-attach the
    // Accordion behaviors.
    dsAirports.addDataChangedObserver("accordionObserver", {
    onDataChanged: function(ds, dcType) { setTimeout(function() { var
    acc = new Spry.Widget.Accordion("Acc1"); }, 0); } });
    </script>
    </head>
    <body>
    <div id="Acc1" class="Accordion"
    spry:region="dsAirports">
    <div class="AccordionPanel" spry:repeat="dsAirports">
    <div class="AccordionPanelLabel">
    <h3>{code}</h3>
    </div>
    <div class="AccordionPanelContent">
    <div>{name}</div>
    </div>
    </div>
    </div>
    </body>
    </html>
    Note the use of a timer in the listener callback. This is
    necessary to force the Accordion call to be triggered *after* the
    dynamic region has been re-generated. This won't be necessary once
    we implement the dynamic region observers mechanism.
    --== Kin ==--

  • OT: Need help on menu, please (JavaScript)

    Hi there and thanx for your help so long.
    My question is about this menu:
    http://www.byscripts.info/scripts/javascript-dynamic-accordion-menu
    I must say that I really need this to work.
    My effort is here:
    www.energywa.co.za/layout/
    It works beautifully in IE but not as beautifully in FF and Chrome.
    Problem:
    By just putting in the adress as above, the coloured boxes do not appear at all. They only appear when I click on the Home link at the top of the page or I type www.energywa.co.za/layout/index.php in the address bar.
    It does this on my local machine as well as the server where it is hosted on.
    What bugs me is that it works perfect from the writer's site in all 3 browsers. Unfortunately there is no support forum on the site and I have alrwady mailed the writer but had no luck yet.
    Can someone please help me? I am in the process of learning JavaScript but can only copy & paste at the moment. ;-)
    Thank you so long.
    Deon

    Hi Gary.
    I eventually got it to work. There is still a lot of clutter in the script which I need to sif through, but it works! I am so relieved. I used the files another person modified (from the link I posted) and changed them here and there.
    I also still need to get my menu to the left, but that should be easy.
    You can again have a look at www.energywa.co.za/layout
    It works in IE, FF and Chrome.
    Thanx very much again for all your help. I don't know what exactly fixed it, but it is there somewhere.
    Regards,
    Deon

Maybe you are looking for

  • The Licence for this music cannot be found

    When I try to play any tracks on OVI player I get the error shown in attachment error1.jpg. I have followed the instructions and accessed my account and in downloaded history I can see the album as shown in attachment error2.jpg When I click on the a

  • How to resolve Message "Incorrect translation in error saving docuemnt message"?

    As of 29/Jan/2014, I only get this message from Adobe Reader of iPad (Japanese environment) Regardless of my subscription, I cannot convert anything to PDF. How to resolve or get money back?

  • Ready Time out error in application log

    Hi All, Recently application are throwing below error when they are connected to databases engine. Application and Databases are two different servers. SQL Server Version: SQL Server 2012 Enterprises Editon Applicaiton: JAVA 2013-12-17 11:38:23,236 [

  • Make DropdownBox initial state to show blank

    Hi! I need to set the initial value selected of sap.ui.commons.DropdownBox to be blank before user interaction, but without adding any empty items. Is this possible? If yes then how? Kind regards for your help Janis

  • Make a plugin directly updatable via Extension Manager

    Hi, so, i have a panel built with Configurator 4 for Photoshop Cs6 and with Extension Builder 3 for CC. Some plugins have the cool feature of being updatable directly from Adobe extension manager. I am trying to find some documentation regarding this