Loop


The icons for the Loop Start and Loop End Elements in the Dreamweaver object palette

To repeat a block of HTML content and/or WebYep Elements in a page you can use the Loop Element. The user can define the number and order of the blocks, which can contain any HTML, JavaScript or PHP content like static text, images or any WebYep Element. Of course the content of the repeated WebYep Elements will be different for every repetition.

The Loop Start Element is represented by the following PHP code:

<?php foreach (WYLoopElement::aLoopIDs("Loopname") as $webyep_oCurrentLoop->iLoopID) { $webyep_oCurrentLoop->loopStart(true); ?> more...

Arguments for the aLoopIDs() PHP function call:
(see "Attributes of the Loop Element" below for details)
  1. "Loopname": A string – the field name for this element.
Arguments for the loopStart() PHP function call:
(see "Attributes of the Loop Element" below for details)
  1. true/false: A boolean – whether the loop control buttons should be inserted automatically.
    true if the loop controls should be inserted automatically at the top of each block.
    false if not. You then need to insert the PHP code for these control buttons manually – see "Automatic controls" below.

The Loop End Element is represented by the following PHP code:

<?php $webyep_oCurrentLoop->loopEnd(); } ?>

Using the Loop Element

To use the Loop Element, create some content in you page that is to be repeated and then place a Loop Start before and a Loop End Element after that content.

Exactly positioning the Loop Element is important:

When repeating content in your page it is important to make sure the resulting HTML code is valid! Repeating a <p> tag without the closing </p> tag for example would result in invalid HTML which will be rendered incorrectly by the browser.

By using the positioning technique described in the introduction to the tutorials ("Positioning the cursor") you can place the Loop Start/End Elements exactly before and after a specific HTML tag and thus make sure the whole HTML tag (including its end element) gets repeated.

In rare cases it might be necessary to position the Start/End Elements "by hand" in Dreamweaver's code view. The Elements are tiny PHP code blocks enclosed in "<?php" and "?>" and can be moved wherever you need them in code view.

In these rare cases when the result of a loop seams wrong, it is a good idea to check the validity of the resulting HTML code: Simply open the page in a browser, go to WebYep edit mode and create some loop blocks. Then leave edit mode and take a look at the resulting HTML code by viewing the code directly in the browser. Maybe also copy the HTML code and paste it into an empty Dreamweaver document: Dreamweaver can check the HTML code for you...

 

For the visitor the content simply repeats with different content for all WebYep Elements inside the loop for every repetition:


To Top of Page

The user can define the number and order of the blocks with the loop controls that usually appear above each block when in edit mode:

The icons of the loop controls mean:

Add new block below this one

Delete this block

Move block up (towards page start)

Move block down (towards page end)

Enable/disable block


To Top of Page

Attributes of the Loop Start Element


The Dreamweaver inspector showing the Loop Start Elements attributes

Loop name

A distinctive name for that element. This name will be displayed in the page in edit mode to give the user a hint on what this elements content stands for and to distinguish the different WebYep Elements in a page.

Important: If you need more than one Loop Element on a page, you have to make sure that the WebYep Elements inside the two loops do not share the same names. Use different names for all WebYep Elements in all Loops of one page!

Automatic controls

The loop controls are usually placed automatically at the top of each loop block, right where the Loop Start is positioned. In some situations this is not appropriate, as the Loop Start might be in a place where no content (like the loop control button icons) is allowed - e.g. between a <table> tag and a <tr> tag.

In theses cases you should uncheck the "Automatic controls" attribute and place the controls "by hand" by inserting the following piece of PHP code:

<?php $webyep_oCurrentLoop->showEditButtons(); ?>

Attributes of the Loop End Element

The Loop End Element has no adjustable attributes.


To Top of Page
© 2009, Objective Development