We launched new forums in March 2019—join us there. In a hurry for help with your website? Get Help Now!
    • 23299
    • 1,161 Posts
    Using Evo 1.0.4 here.

    I have a site that has the content area split into two columns. I would like to add a TV that will allow my client to create an unordered list that will appear in the sidebar column. This list might need to change from page to page or not show at all.

    I would like the markup to show in simple fashion like so:
    <ul="sidebarList>
    <li>Item One</li>
    <li>Item Two</li>
    <li>Item Three</li>
    </ul>


    This way I can style the ul’s and li’s with CSS. What I want is a TV box where the client can just enter Item One, Item Two, Item Three, etc or Apple, Oranges, grapes, or enter nothing and nothing shows. I have messed around with creating a chunk for the UL but but how do I get the TV to present the list items within <li></le> tags? So far I have only succeeded in bringing in the <ul> tag in the generated markup but them items lack the <li> tags. These lists will just be list and not a navigation system.

    Thanks!
      • 3749
      • 24,544 Posts
      Maybe there’s a way to do it with just a TV, but I would create a checkbox TV and a very simple snippet (let’s call it ShowList) to display it. Say the possible list items are red, blue, and green. The Input Option Values of the TV would be: red||blue||green.

      The code would look something like this (assuming that the name of the TV is MyListTv):

      [!ShowList? &tv=`[*MyListTv*]` !]


      <?php
      /* at this point, the $tv variable will contain the options the user selected
          separated by '||';
      */
      
      /* display nothing it no items were checked */
      if (empty($tv)) {
      return '';
      }
      
      /* make an array out of the TV value */
      $values = explode('||', $tv);
      
      $output = '<ul>';
      
      foreach($values as $value) {
          $output .= '<li>' . $value . '</li>';
      }
      
      $output .= '</ul>';
      
      return $output;
      
        Did I help you? Buy me a beer
        Get my Book: MODX:The Official Guide
        MODX info for everyone: http://bobsguides.com/modx.html
        My MODX Extras
        Bob's Guides is now hosted at A2 MODX Hosting
        • 23299
        • 1,161 Posts
        The issue is that I will not know what the Input Option Values will be? The client will be creating his own list. I have no idea of what the list items will be or what the total number will be. I do know that this List feature in the sidebar will be used on some pages but not on others. So, having some dummy list presented as a chunk, via the template will show on all pages which would be a problem.

        I know I could create a sample list and have the client use it as a guide but I am I hoping there is a more elegant means of doing this from the Manager using a more straightforward TV etc? Of course the mission here is keep the client away from coding as much as possible...
          • 7455
          • 2,204 Posts
          you could use a normal textfield tv and let them comma seperate or || seperate the items like this Apple||Oranges||grapes and use the snippet from BobRay to create the list from that. if you use , instead of
          ||then alter the code from the snippet that $values = explode(’||’, $tv); becomes this: $values = explode(’,’, $tv);

          ps I think that the code from BobRay is missing a , in the $values = explode(’||’ $tv); schould be $values = explode(’||’, $tv);

          Dimmy
            follow me on twitter: @dimmy01
            • 23299
            • 1,161 Posts
            Thanks, I am trying to wrap my head around this...

            In my design template I have a chunk in the sidebar called sidebarList with the following:
            [!ShowList? &tv=`[*MyListTv*]` !]
            


            I created a snippet called Showlist with the following:
            <?php
            /* at this point, the $tv variable will contain the options the user selected
                separated by '||';
            */
            
            /* display nothing it no items were checked */
            if (empty($tv)) {
            return '';
            }
            
            /* make an array out of the TV value */
            $values = explode('||', $tv);
            
            $output = '<ul>';
            
            foreach($values as $value) {
                $output .= '<li>' . $value . '</li>';
            }
            
            $output .= '</ul>';
            
            return $output;
            ?>


            I then created a TV called MyListTv that uses an Input Type set to "Textarea" and a Widget set to "Delimited List" with the Delimiter set to ||

            I have connected this TV to my template.

            In a test document I see the new TV there and I entered a test list like so:
            Apples||Oranges||Grapes


            When I go the parsed page in a browser I get this showing in the sidebar on the front end (actual page):
            [[ShowList? &tv=`Apples||Oranges||Grapes` ]]


            What I need is something like this showing in the browser:

            Apples
            Oranges
            Grapes

            I need markup to show like this so I custom style the <ul> and <li> myself.
            <ul>
            <li>Apples</li>
            <li>Oranges</li>
            <li>Grapes</li>
            </ul>


            Any ideas?

            Thanks!

              • 4310
              • 2,310 Posts
              Max, try something like this :
              <?php
              $id = (isset($id))? $id : $modx->documentIdentifier;
              $tvName = (isset($tvName))? $tvName : 'MyListTv';
              $output = '';
              $data = $modx->getTemplateVarOutput(true, $id);
              $tv = $data[''.$tvName.''];
              if (!empty($tv)) {
              $values = explode('||', $tv);
              $output .= '<ul>';
              foreach($values as $value) {
                  $output .= '<li>' . $value . '</li>';
              }
              $output .= '</ul>';
              }
              return $output;
              ?>

              The snippet has two optional paramaters, &id=`nn` &tvName=`the-name-of-your=tv`
              By default the current doc id is used and the tv with the name of MyListTv
                • 23299
                • 1,161 Posts
                Hey David,

                That worked! Thanks very much.

                I made one change to the snippet and the TV: swapped the || delimiter to a comma.

                From
                $values = explode('||', $tv);

                To this:
                $values = explode(',', $tv);


                I think this will easier for the client, maybe? I have also added a classname to the <ul> in the snippet.

                But I am glad I got this working. I really need to learn more PHP. I would never have done this on my own.

                What the client wants is a way to add headlines, text section, custom quotes, statistic and lists of achievements to various sections of the sidebar.

                I now have the <ul> and <li> tags being generated in the markup. I can now style these easily.

                Thanks to all!

                Max

                  • 23299
                  • 1,161 Posts
                  One other question:

                  How do I introduce line breaks after each <li>? This is a minor thing and just for markup convention really.

                  Is there a simple way to add a
                  tag so that I get this:
                  <ul>
                  <li>Apples</li>
                  <li>Oranges</li>
                  <li>Grapes</li>
                  </ul>


                  Instead of this:
                  <ul><li>Apples</li><li>Oranges</li><li>Grapes</li></ul>

                    • 3749
                    • 24,544 Posts
                    Quote from: Dimmy at Jan 09, 2011, 05:07 PM

                    ps I think that the code from BobRay is missing a , in the $values = explode(’||’ $tv); schould be $values = explode(’||’, $tv);
                    Dimmy
                    Not any more, thanks Dimmy. smiley
                      Did I help you? Buy me a beer
                      Get my Book: MODX:The Official Guide
                      MODX info for everyone: http://bobsguides.com/modx.html
                      My MODX Extras
                      Bob's Guides is now hosted at A2 MODX Hosting
                      • 3749
                      • 24,544 Posts
                      Quote from: Photowebmax at Jan 09, 2011, 07:56 PM

                      One other question:

                      How do I introduce line breaks after each <li>? This is a minor thing and just for markup convention really.

                      Is there a simple way to add a
                      tag so that I get this:
                      <ul>
                      <li>Apples</li>
                      <li>Oranges</li>
                      <li>Grapes</li>
                      </ul>


                      Instead of this:
                      <ul><li>Apples</li><li>Oranges</li><li>Grapes</li></ul>



                      $output = "\n<ul>";
                      $output .= "\n"  .  '    <li>' . $value . '</li>';
                      $output = "\n<ul>";


                      Note that you have to use double quotes around the sections with \n in them so they will be interpreted and I added some spaces to indent the <li> lines.

                      Good idea using the commas. You might also want to change $value to strip($value) to remove any spaces the client might have added around the items.
                        Did I help you? Buy me a beer
                        Get my Book: MODX:The Official Guide
                        MODX info for everyone: http://bobsguides.com/modx.html
                        My MODX Extras
                        Bob's Guides is now hosted at A2 MODX Hosting