Dynamic html table creation in webspeed

rhoelle

New Member
Since I've been finding some great code tips here, I thought I pass on one that I whipped up this morning. Hopefully it will be useful to someone.

1. First create a temp table (with field labels) and populate with data. I don't think I need to show that part.

2. Here's the code to dynamically build the html table headers and fields:

Code:
<!--WSS
/*
    This sets up a dynamic query so we can
    get the field names and values during
    the loop. This way we don't need to 
    define them in the html below. Just
    be sure to define the order of the 
    fields when you create the temp table.
*/
DEFINE VARIABLE v-class AS CHARACTER INIT "even".
DEFINE VARIABLE iTmp AS INTEGER NO-UNDO.
DEFINE VARIABLE hQuery AS HANDLE NO-UNDO.
DEFINE VARIABLE hBuffer AS HANDLE NO-UNDO.
CREATE QUERY hQuery.
CREATE BUFFER hBuffer FOR TABLE 'tt'.
hQuery:SET-BUFFERS(hBuffer).
hQuery:QUERY-PREPARE(cQuery).
hQuery:QUERY-OPEN().
hQuery:GET-FIRST().
-->

<table cellpadding="3" cellspacing="0" class="tablesorter">
    <thead>
        <tr>
            <!--WSS DO iTmp = 1 TO hBuffer:NUM-FIELDS: -->
            <th class="header">`hBuffer:BUFFER-FIELD(iTmp):LABEL`</th>
            <!--WSS end. -->
        </tr>
    </thead>
    <tbody>
        <!--WSS DO WHILE NOT hQuery:QUERY-OFF-END: -->
            
            <!--WSS
                /* Used for row striping */
                if v-class = "even" then
                    v-class = "odd".
                else
                    v-class = "even". 
            -->

            <tr class="`v-class`">
                <!--WSS DO iTmp = 1 TO hBuffer:NUM-FIELDS: -->
                <td>`hBuffer:BUFFER-FIELD(iTmp):BUFFER-VALUE`</td>    
                <!--WSS end. -->
            </tr>
            
            <!--WSS hQuery:GET-NEXT(). -->
            
        <!--WSS end. -->
        <!--WSS
            hQuery:QUERY-CLOSE().
            DELETE OBJECT hBuffer NO-ERROR.
            DELETE OBJECT hQuery NO-ERROR.
        -->
    </tbody>
</table>

This works great and if used with jquery and their tablesorter plug-in allows you to sort the columns on the html page without reloading.

Hope you enjoy,
Rick

PS: Improvements welcome...
 

rcgomez11

Member
gud day mr. rhoelle, your codes are really good,really they are..i am new with progress especially webspeed and i need some codes for my assignment..if it is ok, can u cite some progress codes that can add, edit and delete certain data on a specified database..any help will be appreciated..tanx in advance..i really wanted to know this script(webspeed)..it looks very cool as a 4gl language...
 
Top