Features

Cascading style sheets are a series of rules that determine the look and formatting of web page contents. Code On Time applications exclusively use CSS to stylize the pages. DotNetNuke Factory is a special kind of web application designed to work within DotNetNuke portal. All cascading style sheets of a module created with DotNetNuke Factory are compiled as binary resources into the application DLL.

Developers can add their own custom CSS rules in standalone web applications. This technique will not work with a DotNetNuke application. The alternative is to create extensions for the standard themes of the code generation library.

Let’s create a CSS rule that will render text in all inputs as bold for Grapello theme in a DotNetNuke Factory application.

Run Visual Studio. On the toolbar, press File | New | File option.

In the window, select Style Sheet and press Open.

`

A new .css file will open in the editor. Paste in the following rule.

@import "../../Library/_Client/Themes/_Shared/jquery.ui.all.css";

table.DataView tr.CategoryRow td.Fields div.Item div.Value input, 
table.DataView tr.CategoryRow td.Fields div.Item div.Value select, 
table.DataView tr.CategoryRow td.Fields div.Item div.Value textarea
{
    font-weight:bold;
}

The highlighted segment of the path in the Grapello.css file is a relative path to the jQuery UI stylesheets packaged with the code generation library. The rule will apply a font weight of “Bold” to all inputs in a category. Right-click on the tab of the file, and press Save File.

Change the save location to [My Documents]/Code OnTime/Client/Themes folder, and change the name of the file to the name of the theme. In this case, Grapello theme is being used, and the name of the file will be “Grapello.css”.

Press OK to save.

Restart Code On Time web application generator. While holding Shift, click on a project name. This will skip to the Summary page. Press Generate.

Navigate to any data view, and edit a record. The custom CSS will make all text in inputs bold.

Data integrity is enforced with validation and conversion business rules. The Project Designer can quickly create and configure generic business rules with a single click. JavaScript, SQL, and Code (C#/Visual Basic) validators and converters are created from the context menu of the fields in Project Explorer.

Converter

The generic converter will convert the field value to uppercase.

For example, the Category Name field in the Categories controller has been configured with the default SQL converter. The sample script is shown below.

if @CategoryName is not null and 
    (@Arguments_CommandName <> 'Calculate' or
     @Arguments_Trigger = 'CategoryName')
begin
    set @CategoryName = upper(@CategoryName)   
end

The user may enter any value into the field.

When focus is shifted away from the field, the conversion will take place.

SQL and code validators are executed on the server.

Validator

The generic validator will ensure that the field value is not blank.

The Description field of Categories controller has been configured with the default JavaScript validator:

var fieldValue = [Description];
if (fieldValue == null) {
    // prevent the default action processing
    this.preventDefault();
    // set the focus on the field and display an error
    this.result.focus('Description', 'Required field.');
}

After typing a category name, pressing OK will display a message next to the Description field, despite the fact that the field is not marked as required.

These sample validators and converters can be expanded to perform more complex operations to fulfill specific business requirements. Any single validator or converter can handle multiple fields when necessary.