Editing HTML Source Code

When a page is opened in the HTML mode within the document window, the HTML code that makes up the page template is available for viewing and editing. While most of the HTML code is standard HTML markup, typical of any HTML page, there are some considerations that you need to remember if you edit the code manually.

Each page within CodeCharge Studio is composed of an HTML template whose contents are visible in the HTML mode and programming code that can be viewed in Code mode. When the pages are published to the server and requested by a user over a browser, the programming code opens and parses the HTML template code to create the final page that is sent back to the users browser. The HTML template contains special blocks of HTML code which form the basis of the parsing process. It is imperative that these blocks of HTML code be in a specific format in order for the page to be parsed correctly.

The main template blocks within the HTML template are demarcated by HTML comments.

<!-- BEGIN Block Name -->

Components, objects, and other code contents go here.

<!-- END Block Name -->

The HTML comments mark the beginning and end of a block of HTML code that can be treated as a unique entity during the parsing process. It is normal for a block to contain other nested blocks. For example, a block for a grid form also contains blocks for the sorters, the row as well as the navigation controls for the grid. It should be evident that, for the grid to be parsed correctly, the different blocks that make up the grid must be present and with their correct names. Care should be taken when editing the HTML source code so as not to render the blocks unusable by the programming code.

Along with the template blocks, an HTML template page also contains template variables that are always contained within curly braces (i.e., {}). The following code demonstrates a row template block with five template variables within the cells of a table row.

<!-- BEGIN Row -->
<tr>
<td>{task_name}</a></td>
<td>{project_id}</td>
<td>{priority_id}</td>
<td>{status_id}</td>
<td>{user_id_assign_to}</td>
</tr>
<!-- END Row -->

Template variables represent values are determined at run-time and substituted into the template page to create the final page. For instance, each database field in a grid form has a corresponding template variable. When the page is executed, the programming code retrieves values from the database and replaces the template variables with the retrieved values. Just like template blocks, the names of template variables should not be altered or the programming code will not be able to parse the variables. Template variables can be moved around to customize or adjust the layout of the page but this should be done with care and prior knowledge of how the change will affect the parsing of the page.

See next