Updated 1.03 Grid layout (markdown)

1.03-Grid-layout.md

@@ -11,29 +11,53 @@
   <tbody>
     <tr> 
       <th>grid_layout</th>
-      <td>boolean</td>
+      <td>boolean|object</td>
       <td>enables / disables grid layout generation (default - true) </td>
       <td>&nbsp;</td>
-      <td><code>var tfConfig = { grid_layout: true }</code></td>
+      <td>
+         <pre>
+var tfConfig = { grid_layout: true };
+// or
+var tfConfig = { 
+  grid_layout: {} 
+};
+        </pre>
+      </td>
     </tr>
     <tr> 
-      <th>grid_width</th>
+      <th>width</th>
       <td>string</td>
       <td>this property defines the width of the main container of the grid 
         (default - null)</td>
       <td>&nbsp;</td>
-      <td><code>var tfConfig = { grid_width: '850px' }</code></td>
+      <td>
+         <pre>
+var tfConfig = { 
+  grid_layout: {
+    width: '850px'
+  } 
+};
+        </pre>
+      </td>
     </tr>
     <tr> 
-      <th>grid_height</th>
+      <th>height</th>
       <td>string</td>
       <td>this property defines the height of the main container of the grid 
         (default - null)</td>
       <td>&nbsp;</td>
-      <td><code>var tfConfig = { grid_height: '400px' }</code></td>
+      <td>
+         <pre>
+var tfConfig = { 
+  grid_layout: {
+    height: '400px'
+  } 
+};
+        </pre>
+      </td>
     </tr>
     <tr> 
-      <th>grid_cont_css_class</th>
+      <th>cont_css_class</th>
       <td>string</td>
       <td>defines the css class of the main container of the grid (default 
         * 'grd_Cont')</td>
@@ -43,61 +67,124 @@
           <li>a middle div containing the data table</li>
           <li>a bottom div containg the paging elements</li>
         </ul></td>
-      <td><code>var tfConfig = { grid_cont_css_class: 'myclass' }</code></td>
+      <td>
+         <pre>
+var tfConfig = { 
+  grid_layout: {
+    cont_css_class: 'myclass'
+  } 
+};
+        </pre>
+      </td>
     </tr>
     <tr> 
-      <th>grid_tbl_cont_css_class</th>
+      <th>tbl_cont_css_class</th>
       <td>string</td>
       <td>defines the css class of the container of the data table (default 
         * 'grd_tblCont')</td>
       <td>&nbsp;</td>
-      <td><code>var tfConfig = { grid_tbl_cont_css_class: 'myclass' }</code></td>
+      <td>
+         <pre>
+var tfConfig = { 
+  grid_layout: {
+    tbl_cont_css_class: 'myclass'
+  } 
+};
+        </pre>
+      </td>
     </tr>
     <tr> 
-      <th>grid_tblHead_cont_css_class</th>
+      <th>tbl_head_css_class</th>
       <td>string</td>
       <td>defines the css class of the container of the headers' table (default 
         * 'grd_headTblCont')</td>
       <td>&nbsp;</td>
-      <td><code>var tfConfig = { grid_tblHead_cont_css_class: 'myclass' }</code></td>
+      <td>
+         <pre>
+var tfConfig = { 
+  grid_layout: {
+    tbl_head_css_class: 'myclass'
+  } 
+};
+        </pre>
+      </td>
     </tr>
     <tr> 
-      <th>grid_inf_grid_css_class</th>
+      <th>inf_grid_css_class</th>
       <td>string</td>
       <td>defines the css class of the bottom div containing the paging elements 
         (default - 'grd_inf')</td>
       <td>&nbsp;</td>
-      <td><code> var tfConfig = { grid_inf_grid_css_class: 'myclass' }</code></td>
+      <td>
+         <pre>
+var tfConfig = { 
+  grid_layout: {
+    inf_grid_css_class: 'myclass'
+  } 
+};
+        </pre>
+      </td>
     </tr>
-    <tr class="newBg"> 
-      <th>grid_headers_row_index</th>
+    <tr> 
+      <th>headers_row_index</th>
       <td>number</td>
       <td>defines which row contains the column headers (default - 0)</td>
       <td>&nbsp;</td>
-      <td><code> var tfConfig = { grid_headers_row_index:1 }</code></td>
+      <td>
+         <pre>
+var tfConfig = { 
+  grid_layout: {
+    headers_row_index: 1
+  } 
+};
+        </pre>
+      </td>
     </tr>
     <tr> 
-      <th>grid_enable_default_filters</th>
+      <th>filters</th>
       <td>boolean</td>
       <td>enables/disables the filters generation (default - true)</td>
       <td>&nbsp;</td>
-      <td><code>var tfConfig = { grid_enable_default_filters: false 
-        }</code></td>
+      <td>
+         <pre>
+var tfConfig = { 
+  grid_layout: {
+    filters: false
+  } 
+};
+        </pre>
+      </td>
     </tr>
     <tr> 
-      <th>grid_default_col_width</th>
+      <th>default_col_width</th>
       <td>string</td>
       <td>defines the default column width if no width is defined (default 
         * '100px')</td>
       <td>&nbsp;</td>
-      <td> <code>var tfConfig = { grid_default_col_width: "125px" }</code></td>
+      <td>
+         <pre>
+var tfConfig = { 
+  grid_layout: {
+    default_col_width: '125px'
+  } 
+};
+        </pre>
+      </td>
     </tr>
     <tr> 
-      <th>grid_no_headers</th>
+      <th>no_headers</th>
       <td>boolean</td>
       <td>instructs the component that current working table has no headers (default - false)</td>
       <td>&nbsp;</td>
-      <td><code>var tfConfig = { grid_no_headers: true }</code></td>
+      <td>
+         <pre>
+var tfConfig = { 
+  grid_layout: {
+    no_headers: true
+  } 
+};
+        </pre>
+      </td>
     </tr>
   </tbody>
 </table>