Definition Eine Tabelle zeigt eine Sammlung von Daten an, die in Zeilen gruppiert sind.

Die Überschriften der Spalten können statisch festgelegt oder dynamisch vom S10 Framework ermittelt werden.
Code
to clipboard 
<!-- Definition of the columns (static labels) -->
<div class="colheaders">
	<div class='colheadup' name="my_s10_field_1" 
	     style='width:  80px;'>Column 1</div>

	<div class='colhead' name="my_s10_field_2" 
	     style='width: 120px;'>Column 2</div>

	<div class='colhead' name="my_s10_field_3" 
	     style='width:  90px;'>Column 3</div>
</div>

<!-- Definition of a table row -->
<form class='table' name='my_s10_folder'>
	<div class="tablerow">

		<div class='outputcelldiv' name="my_s10_field_1" 
		     style='width:  80px;' ></div>

		<div class='outputcelldiv'  name="my_s10_field_2" 
			 style='width: 120px;'></div>

		<div class='outputcelldiv' name="my_s10_field_3" 
		     style='width:  90px;' ></div>
	</div>
</form>
Beispiel
Code
to clipboard 
<!-- Definition of the columns (dynamic labels) -->
<div class="colheaders">

	<div class='colhead output' 
	     style='width: 80px;' name="vbeln">
	</div>

	<div class='colhead output desktop' 
	     style='width: 120px' name="auart@text">
	</div>

	<div class='colhead output colheaddown' 
	     style='width: 90px;' name="audat">
	</div>

	<div class='colhead output totals' 
	     style='width: 80px; text-align: right;  
		        --desktop-width: 120px;' 
		 name="netwr">
	</div>

	<div class='colhead output landscape' 
	     style='width: 50px' name="waerk">
	</div>

</div>

<!-- Definition of a table row -->
<form class='table' name='allorders'>

	<div class="tablerow" onclick="S10ToggleDetail(this);">

		<div class='outputcelldiv' style='width: 80px;' 
		     name="vbeln"></div>

		<div class='outputcelldiv desktop' 
		     style='width: 120px;' name="auart@text"></div>

		<div class='outputcelldiv' style='width: 90px;' 
		     name="audat"></div>

		<div class='outputcelldiv' 
		     style='width: 80px; text-align: right;  
			        --desktop-width: 120px;' 
			name="netwr">
		</div>

		<div class='outputcelldiv landscape' 
		     style='width: 50px' name="waerk"></div>

	</div>

</form>
Beispiel
Komponente S10 Framework