Blog: Posts from June, 2012

Posts from June, 2012
Saturday, June 30, 2012PrintSubscribe
Introducing JavaScript Business Rules

An application data controller can define powerful JavaScript Business Rules to perform validation and required interactions with the user. The rules are written in JavaScript to execute in the client web browser.

JavaScript Business Rule defined in 'Customers' data controller of the Northwind sample created with Code On Time web application generator for ASP.NET, Windows Azure, DotNetNuke, and SharePoint

Application client library will create an instance of a JavaScript class enhanced with the rules defined in the data controller to handle actions in a fashion similar to server-side SQL Business Rules and C#/Visual Basic Business Rules. A rule can analyze the field values, change them, request additional information, or prevent an action from execution.

This is the example of a JavaScript business rule performing client-side validation.

// validate the data field value
if ([Country] == 'USA') {
    // tell the client library to skip the execution of update, insert, or delete
    // set the focus to the field "Country" and display an error message
        'Country', 'You are not authorized to {0}, if the country ' +
        'is equal to "USA".',
    // show an additional information in the message bar at the top of the page
    this.result.showMessage('Error trying to execute {0} command', 

The implementation of the business rule is functionally equivalent to the SQL business rule performing validation on the database engine level, but does not involve a round-trip between a browser and webserver.

This screenshot demonstrates the business rule in action.

Validation with JavaScript Business Rules in a web app created with Code On Time web application generator

Learn to create sophisticated JavaScript Business Rules performing complex data validation and just-in-time correction of values.

Saturday, June 30, 2012PrintSubscribe
Action “Client Script”

Client Script actions allow execution of arbitrary JavaScript code. For example, an action with command name Client Script can select a page of data that contains a specific record in response to user actions. This example takes advantage of automatic tracking of selected records supported by the application framework.

The Employees table of the Northwind sample has a foreign key column ReportsTo that references the table itself. Code On Time generator automatically creates a master-detail relationship on the Employees page. Let’s configure an action on the Employees data controller to select a specific record in the master view.

Employees page with Employees master and child data views.

There are two data views on the Employees page hooked to the Employees controller. Let’s tag the top view as a “master list” of employees.

Start the Project Designer. In the Project Explorer, double-click on Employees / container1 / view1 node.

View1 on Employees page.

Change the following properties:

Property New Value
Tag MasterList
Page Size 3

Press OK to save the data view.

Next, add an action to perform synchronization of the master list with a specific EmployeeID. Right-click on Customers / container1 / view1 / Actions / ag1 (Grid) node, and select New Action.

New Action in ag1 action group of Employees controller.

Give this action the following properties:

Property Value
Command Name Client Script
Command Argument
Web.DataView.find('MasterList', 'Tag').sync(this.fieldValue('EmployeeID'))
Header Text Show in Master List

Press OK to save the action. On the toolbar, select Browse button.

On the Employees page, select Andrew Fuller from the list. An Employees child data view will open underneath. Activate the context menu for Steven Buchanan and select Show in Master List option.

Fuller employee selected in the master Employees data view. Context menu option 'Show in Master List' selected for Buchanan employee in the child data view.

The master data view will move to the page that contains Steven Buchanan with the corresponding row selected. The child data view will refresh showing employees reporting to Mr. Buchanan.

Using the context menu for Robert King, select Show in Master List.

Buchanan focused in the master data view. 'Show in Master List' context menu option for employee King in the child data view.

Robert King will be selected on the third page of the master view.

King employee focused in the master data view.

Saturday, June 30, 2012PrintSubscribe
Auto-Complete with Matching Anywhere

Code On Time applications feature auto complete of field values in multiple elements of the user interface. By default, auto complete will match any field values that begin with the provided sample text.

The following example of “begins with” matching in the Advanced Search Bar shows last names that begin with “le”. Only one data row with value “Leverling” in the Last Name field has been matched.

Entering 'le' in Last Name search field will find only one data row with a matching value in the Last Name column

Let’s configure the field to perform auto complete matching in any part of the field value.

Start the Project Designer. In the Project Explorer, double-click on Employees / container1 / view1 / grid1 / LastName data field node.

LastName data field of grid1 of Employees on the Employees page.

Change the Search Options property:

Property New Value
Search Options $autocompleteanywhere

Press OK to save the data field. On the toolbar, select Browse.

When the web application loads, activate the Advanced Search Bar on the Employees page. The auto complete for Last Name will now match the search parameter “le” with two data rows that have “Fuller” and “Leverling” values in the column.

Entering 'le' in the Last Name field will match two values.