You have a dataset of re-occouring fields (think of the Miniservers list in LoxBerrry) and you want to display this in your HTML.

For the following example, we use the Miniserver list for demonstration.

HTML::Template enables you to create one "sub-form" with several fields (e.g. one Miniserver form), and HTML::Templates loops through your dataset (multiple Miniservers) to create the page.

HTML::Template expects an array holding a hash for each dataset (Miniserver). Therefore, you need to fill a hash for each element, and push this hash to the array:

my @msdata = ();
 
    for ($msno = 1; $msno<=$miniservers; $msno++) {  
        my %ms;
        $ms{MSNO} = $msno;
        $ms{MSIP} = $cfg->param("MINISERVER$msno.IPADDRESS");
        $ms{MSPORT} = $cfg->param("MINISERVER$msno.PORT");
        $ms{MSUSER} = uri_unescape($cfg->param("MINISERVER$msno.ADMIN"));
        $ms{MSPASS} = uri_unescape($cfg->param("MINISERVER$msno.PASS"));
        $ms{MSUSECLOUDDNS} = is_enabled ($cfg->param("MINISERVER$msno.USECLOUDDNS")) ? "checked" : "";
        $ms{MSCLOUDURL} = $cfg->param("MINISERVER$msno.CLOUDURL");
        $ms{MSCLOUDURLFTPPORT} = $cfg->param("MINISERVER$msno.CLOUDURLFTPPORT");
        $ms{MSNOTE} = $cfg->param("MINISERVER$msno.NOTE");
        $ms{MSNAME} = $cfg->param("MINISERVER$msno.NAME");
 
        push(@msdata, \%ms);
    }
 
    $maintemplate->param(MSDATA => \@msdata);

This example expects the ready Miniserver data in the $cfg object (a Config::Simple config file), but you can fill up the data from where you want.

In line 1, an empty array @msdata is created.

In the for loop, we loop through our Miniserver data from the config file.

Line 4 creates an hash element %ms. We store all the data of one Miniserver to this hash.

The following lines are filling up this hash. The names of the hash entries (MSNO, MSIP etc.) are at your will, and later are referenced in the HTML template.

In line 16 the hash is pushed to the array. Actually, the hash reference is pushed, therefore take attention to the syntax \%ms (with backslash).

As the loop finishes, we have an array with hash references to all Miniserver data.

Finally, we send this array to the HTML::Template object in line 19. Also take attention that we send an array reference to HTML::Template, therefore \@msdata (again with backslash).

To use these data in your HTML template, we need a loop in the HTML code. (The code snippet only shows the loop and is simplified. )

<TMPL_LOOP NAME="MSDATA">
    Miniserver number: <TMPL_VAR MSNO> <br>
    Name: <TMPL_VAR MSNAME> <br>
    IP: <TMPL_VAR MSIP> <br>    
    Port: <TMPL_VAR MSPORT> <br>
    <!-- and so on... -->
</TMPL_LOOP>

As you can see, in line 1 the loop needs to be initialized with the name of the field (we sent in the Perl code), and be closed with a </TMPL_LOOP> tag.

Inside the loop, use the hash element names you defined in your Perl code.

HTML::Template will loop through your array and generates an HTML with every Miniserver. The output is generated in the order you fill up the array.

The Perl Miniserver code is found on your LoxBerry Miniserver widget in /opt/loxberry/webfrontend/htmlauth/system/miniserver.cgi

The using template is /opt/loxberry/templates/system/miniserver.html (the real template is more sophisticated then the above html example because of form, multilanguage, validation etc.)