Tips_tutorials   >   Studiojs201   >   HTML Tools

HTML Tools

Rather than put all of our code in methods of each remote task, we will put the general methods in an object class which we can call from different remote tasks. This may seem a bit complicated at first, but you will see the benefits later on as we add more remote tasks.

  1. F2 Browser > select ContactsWeb library > New Class > Object Class.
  2. Name the object class, oHTMLTools

Return HTML Template

We will need a method that returns an HTML page template.

  1. Add a public method, $retHTMLPageTemplate to oHTMLTools.
  2. Add the following code to the method:

Begin text block
Text: <html> (Carriage return,Linefeed)
Text: <head> (Carriage return,Linefeed)
Text: <title>##TITLE##</title> (Carriage return,Linefeed)
Text: </head> (Carriage return,Linefeed)
Text: <body> (Carriage return,Linefeed)
Text: (Carriage return,Linefeed)

Text: (Carriage return,Linefeed)

Text: <p>##BODY##</p> (Carriage return,Linefeed)

Text: (Carriage return,Linefeed)
Text: </body> (Carriage return,Linefeed)
Text: </html> (Carriage return,Linefeed)
End text block

Get text block HTML

Quit method HTML

##TITLE## and ##BODY## are placeholders which can be replaced by the sender using the replaceall() function. You will see this later on in the tutorial.

Note

This is a very basic HTML page. For your real world application you would need to include numerous additional sections and tags.

Convert List to HTML Table

We will need a method than converts an Omnis Studio list into an HTML table.

  1. Add a public method, $convertListToHTMLTable, to the oHTMLTools.

    Tip

    If you have StudioTips you can copy any of the code snips by clicking the Sample Code button which takes you to the actual code, then copy and paste the code to your own method.

  2. Add the following parameters to the method:
    1. pfList - field reference
    2. pbInclSelectCheckBoxes - booleann default kTrue
    3. pCSVColNames - character
    4. pCSVColHeadings - character
    5. pPrimayKeyColName - character

  3. Add the following class variables:
    1. kTableCloseTag - character - initial value '</table>'
    2. kTableDivCloseTag - character - init value '</td>'
    3. kTableDivOpenTag - character - init value '<td>'
    4. kTableOpenTag - character - initial value '<table>'
    5. kTableRowCloseTag - character - init value '</tr>'
    6. kTableRowOpenTag - character - init value '<tr>'

  4. Add the following code to the method:

Calculate List as pfList

; Open the table
Calculate HTML as kTableOpenTag

; Open the table header group.
Calculate HTML as con(HTML,kCr,'<thead>')

Calculate HTML as con(HTML,kCr,kTableRowOpenTag)

; Add a checkbox column for selecting rows.
If pbInclSelectCheckBoxes
   Calculate HTML as con(HTML,kCr,'<th>','','</th>')
End If

; Add the header row columns.
Calculate String as pCSVColHeadings
While len(String)
   
   Calculate Text as strtok('String',',')
   Calculate HTML as con(HTML,kCr,'<th>',Text,'</th>')
   
End While

; Close the table header row
Calculate HTML as con(HTML,kCr,kTableRowCloseTag)

; Close the table header group.
Calculate HTML as con(HTML,kCr,'</thead>')

; Open the table body group.
Calculate HTML as con(HTML,kCr,'<tbody>')

; Add the list rows and columns.
For List.$line from 1 to List.$linecount step 1
   
   ; Open the row.
   Calculate HTML as con(HTML,kCr,kTableRowOpenTag)
   
   ; Add a checkbox column for selecting rows. The primary key is stored in the checkbox id attribute.
   If pbInclSelectCheckBoxes
      If List.0.$selected()
         Calculate SelectCheckBox as con('<input type="checkbox" name="selected" id="',List.[pPrimaryKeyColName],'" value="pkey" checked="true" />')
      Else
         ; Do not include a 'checked=' attribute. checked="false" or "0" still caused it to be checked.
         Calculate SelectCheckBox as con('<input type="checkbox" name="selected" id="',List.[pPrimaryKeyColName],'" value="pkey" />')
      End If
      Calculate HTML as con(HTML,kCr,kTableDivOpenTag,SelectCheckBox,kTableDivCloseTag)
   End If
   
   ; Add the columns.
   Calculate String as pCSVColNames
   While len(String)
      
      Calculate ColName as strtok('String',',')
      Calculate HTML as con(HTML,kCr,kTableDivOpenTag,List.[ColName],kTableDivCloseTag)
      
   End While
   
   ; Close the list row
   Calculate HTML as con(HTML,kCr,kTableRowCloseTag)
   
End For

; Close the table body group.
Calculate HTML as con(HTML,kCr,'</tbody>')

; Open the table footer group.
Calculate HTML as con(HTML,kCr,'<tfoot>')


; Close the table footer group.
Calculate HTML as con(HTML,kCr,'</tfoot>')

; Close the table.
Calculate HTML as con(HTML,kCr,kTableCloseTag)

Quit method HTML

Add HTTP Content Header

We will need a method than adds the Content-type and Content-length header to the HTML.

  1. Add a public method, $addHTTPContentHeader, to oHTMLTools.
  2. Add the following code to the method. (You can copy this code from the rtPing class which you created earlier.)

Calculate ContentLength as len(pfHTML)

; HTTP Content type header.
Begin text block
Text: Content-type: text/html (Carriage return,Linefeed)
Text: Content-length: [ContentLength] (Carriage return,Linefeed)
Text: (Carriage return,Linefeed)
End text block
Get text block HTTPHeaderText

Calculate pfHTML as con(HTTPHeaderText,pfHTML)

Quit method kTrue