7 Replies Latest reply: Aug 4, 2012 9:01 PM by XeonKiller RSS

    CollapsiblePanel inside DataSet

    sakizo Community Member
      It looks not so difficult, but I'm trying many times but can't work.
      My code is like...

      <div spry:region="dsItems1 dsToppings">
      <div>
      <div spry:repeat="dsItems1">
      <p>{name}</p>
      <p>{explain}</p>
      <div>
      <div spry:repeat="dsToppings">
      <p>{dsToppings::date}</p>
      <div id="CollapsiblePanel1" class="CollapsiblePanel">
      <div class="CollapsiblePanelTab" tabindex="0">MoreInfo</div>
      <div class="CollapsiblePanelContent">{dsToppings::moreinfo}</div>
      </div>
      </div>
      </div>
      </div>
      </div>

      <script type="text/javascript">
      <!--
      var CollapsiblePanel1 = new Spry.Widget.CollapsiblePanel("CollapsiblePanel1");
      //-->
      </script>

      Please teach me how should I do.
      Thanks in advance,
        • 1. Re: CollapsiblePanel inside DataSet
          Proxim0o Community Member
          I could be wrong but what it looks like to me is that you are repeating the CollapsiblePanel1 over and over again if you changed the name to be unique I think that should solve your problem. So maybe do

          <div id="CollapsiblePanel{ID}" class="CollapsiblePanel">

          or something like that.
          • 2. Re: CollapsiblePanel inside DataSet
            sakizo Community Member
            Thank you so much for your answer.
            But it does not work...
            I changed XML has only one childnode / this means no spry:repeat and also there is only one div "id" isn't it?
            COLLAPSIBLEPANEL does not under this situation.

            And I moved this COLLAPSIBLEPANEL set to outside <div spry:region="dsItems1 dsToppings"></div>,
            and write
            <div id="CollapsiblePanel2" class="CollapsiblePanel">
            <div class="CollapsiblePanelTab" tabindex="0"> MoreInfo </div>
            <div class="CollapsiblePanelContent" spry:region="dsItems1 dsToppings">{dsToppings::moreinfo}</div>
            </div>
            COLLAPSIBLEPANEL works well.

            I have no way...
            Please teach me the way to solve.
            Thanks in advice.
            • 3. Re: CollapsiblePanel inside DataSet
              kinblas Community Member
              Hi sakizo,

              Take a look at this accordion (from data) sample. The principles are the same for all our widgets that folks try to create with regions and data sets.

              Basically, you need to choose a way to fire off your widget constructor *AFTER* Spry has processed the region.

              http://labs.adobe.com/technologies/spry/samples/accordion/AccordionSample2.html

              --== Kin ==--
              • 4. CollapsiblePanel inside DataSet
                sakizo Community Member
                Thank you kinblas,It works !!
                But works only first one....
                As Proxim0o mentioned above, I have to put some unique id or something like that.

                I think I must put
                <div id=" CollapsiblePanel" class="CollapsiblePanel">
                and
                var CollapsiblePanel = new Spry.Widget.CollapsiblePanel("b]CollapsiblePanel");

                What should I change ?
                This is my test page
                http://www.kimochiwaburenai.com/_test2/0.html
                • 5. Re: CollapsiblePanel inside DataSet
                  sakizo Community Member
                  Thank you kinblas,It works !!
                  But works only first one....
                  As Proxim0o mentioned above, I have to put some unique id or something like that.

                  I think I must put
                  <div id=" CollapsiblePanel" class="CollapsiblePanel">
                  and
                  var CollapsiblePanel = new Spry.Widget.CollapsiblePanel(" CollapsiblePanel");

                  What should I change ?
                  This is my test page
                  http://www.kimochiwaburenai.com/_test2/0.html
                  • 6. Re: CollapsiblePanel inside DataSet
                    sakizo Community Member
                    Thank you kinblas,It works !!
                    But works only first one....
                    As Proxim0o mentioned above, I have to put some unique id or something like that.

                    I think I must put
                    <div id=" CollapsiblePanel" class="CollapsiblePanel">
                    and
                    var CollapsiblePanel = new Spry.Widget.CollapsiblePanel(" CollapsiblePanel");

                    What should I change ?
                    This is my test page
                    http://www.kimochiwaburenai.com/_test2/0.html

                    Thanks in advance,
                    • 7. Re: CollapsiblePanel inside DataSet
                      XeonKiller

                      For everybody reference:

                       

                      <body>

                      <div spry:region="GetGroupNews">

                        <div spry:repeat="GetGroupNews">

                          <div id="{GroupNews_ID}" class="CollapsiblePanel">

                            <div class="CollapsiblePanelTab" tabindex="0">Tab:{GroupNews_Title}</div>

                            <div class="CollapsiblePanelContent">{GroupNews_Content}</div>

                          </div>

                          <script type="text/javascript">

                      var GroupNews_ID = new Spry.Widget.CollapsiblePanel("{GroupNews_ID}");

                      </script>

                       

                      </div>

                       

                      </body>

                       

                      Thanks~