myTable = new TableHelper(); myTable.AssignMenu( GetStdTableMenu() ); myTable.NewHeader(); myTable.AddCell("a") myTable.AddCell("b") myTable.NewRow() myTable.AddCell("c d", {"colspan":"2"} ) myTable.NewRow() myTable.AddCell( sysvar("_ULN[0]")) myTable.AddCell("f") document.write(myTable.flush())
The class provides an easy to use HTML-Table Wrapper.
The class doesn't uses DOM-Functions, the result is plain HTML-Code.
First Step: Initiate the object
myTable = new TableHelper();
TableHelper.AssignMenu( myMenu )
Table will popup passed Menu on left-click event. Furthermore the cursor changes to a hand if the mouse is over the table.
TableHelper.AddRaw(Content)
This function adds plain HTML code to the output of TableHelper. It is most commonly used to add the colgroup-Element to hint the browser about possible width of columns.
That is important to minimize render flaws by the browser.
myTable = new TableHelper(); myTable.AssignMenu( GetStdTableMenu() ); myTable.AddRaw('<colgroup><col width=20%><col width=20%><col width=20%><col width=20%><col width=20%></colgroup>'); myTable.NewHeader(); ....
TableHelper.NewHeader()
Function creates a new row but wraps <head> -Elements around.
TableHelper.NewRow([Element-Attributes])
Function creates an new row. Further calls to AddCell will use this new row.
The function also adds automatically the CSS-Style-Class "odd" to every odd row.
myTable = new TableHelper(); myTable.NewRow() myTable.AddCell("a") myTable.NewRow( {"class":"cssClassName"}) myTable.AddCell("b")
TableHelper.AddCell(Content, [Element-Attributes])
This function adds an td-Element to the current row
myTable.AddCell("content<b>!<b>", {"class":"cssClassName", "attr2":"val2"})
Result: <td class="cssClassName" arg2="val2"> content<b>!<b> </td>
TableHelper.flush()
Returns the HTML code for the table. It can be passed directly to document.write.
Example:
document.write(myTabler.flush()); // or document.getElementById("myDiv").innerHTML = myTabler.flush();
AddCellWithOverlib(Content, sOverlib)
Function adds a new cell to the current row.
Furthermore there is a tooltip with text sOverlib if the user hovers over the cell with the mouse.