0 Replies Latest reply on Sep 6, 2010 4:51 AM by dilie

    Spry Accordion not working in AIR

    dilie

      Hi,

       

      I'm trying to make an AIR application using HTML/CSS/Javascript and Spry.

       

      I have an xml dataset populating a spry accordion panel widget. Everything works perfectly in the browser but when I preview it in Adobe AIR, there is no accordion functionality;

       

      Here is my code:

       

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

      <html xmlns:spry="http://ns.adobe.com/spry">

      <head>

      <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />

      <meta name="author" content="Dionne Lie-Sam-Foek" />

      <title>TV Show Manager</title>

      <link href="_Assets/css/main.css" rel="stylesheet" type="text/css" />

      <script type="text/javascript" src="_Assets/frameworks/AIRAliases.js"></script>

      <script type="text/javascript" src="_Assets/javascript/functions.js"></script>

      <script src="_Assets/spry/xpath.js" type="text/javascript"></script>

      <script src="_Assets/spry/SpryData.js" type="text/javascript"></script>

      <script src="_Assets/spry/SpryNestedXMLDataSet.js" type="text/javascript"></script>

      <script src="_Assets/spry/SpryAccordion.js" type="text/javascript"></script>

      <script type="text/javascript">

      var dsSeasons = new Spry.Data.XMLDataSet("http://www.tvrage.com/feeds/episode_list.php?sid=3908", "Show/Episodelist/Season", {sortOnLoad:"@no", sortOrderOnLoad:"descending"});

      var dsEpisodes = new Spry.Data.NestedXMLDataSet(dsSeasons, "episode", {sortOnLoad:"seasonnum", sortOrderOnLoad:"descending"});

      dsSeasons.setColumnType("@no", "number");

      var observer = { onPostUpdate: function(notifier, data) { var acc = new Spry.Widget.Accordion('accordion', { useFixedPanelHeights: false, duartion: 300 }); }};

      Spry.Data.Region.addObserver('accordion', observer);

      </script>

      <link href="_Assets/spry/SpryAccordion.css" type="text/css" rel="stylesheet" />

      </head>

      <body>

      <div id="wrapper">

      <div id="main">

          <h1>TV Show Title</h1>

          <div id="showInfo" spry:region="dsSeasons dsEpisodes" class="SpryHiddenRegion">

              <h2>Episode List</h2>

                  <div id="accordion" class="Accordion">

                  <div class="AccordionPanel" spry:repeat="dsSeasons">

                      <h3 class="AccordionPanelTab">Season {@no}</h3>

                          <div class="AccordionPanelContent">

                              <table spry:repeatchildren="dsEpisodes">

                                  <tr class="{dsEpisodes::ds_EvenOddRow}">

                                      <td><input name="seen" type="checkbox" value="1" /></td>

                                      <td>{function::seasonnr}<span class="ex">x</span>{dsEpisodes::seasonnum}</td>

                                      <td>{function::airdate}</td>

                                      <td><a href="{dsEpisodes::link}" target="_blank">{dsEpisodes::title}</a></td>

                                  </tr>

                              </table>

                          </div>

                      </div>

                  </div>     

              </div>

          </div>

      </div>

      </body>

      </html>

       

      I hope someone can point me in the right direction