Tutorials

Labels
AJAX(112) App Studio(7) Apple(1) Application Builder(245) Application Factory(207) ASP.NET(95) ASP.NET 3.5(45) ASP.NET Code Generator(72) ASP.NET Membership(28) Azure(18) Barcode(2) Barcodes(3) BLOB(18) Business Rules(1) Business Rules/Logic(140) BYOD(13) Caching(2) Calendar(5) Charts(29) Cloud(14) Cloud On Time(2) Cloud On Time for Windows 7(2) Code Generator(54) Collaboration(11) command line(1) Conflict Detection(1) Content Management System(12) COT Tools for Excel(26) CRUD(1) Custom Actions(1) Data Aquarium Framework(122) Data Sheet(9) Data Sources(22) Database Lookups(50) Deployment(22) Designer(177) Device(1) DotNetNuke(12) EASE(20) Email(6) Features(101) Firebird(1) Form Builder(14) Globalization and Localization(6) How To(1) Hypermedia(2) Inline Editing(1) Installation(5) JavaScript(20) Kiosk(1) Low Code(3) Mac(1) Many-To-Many(4) Maps(6) Master/Detail(36) Microservices(4) Mobile(63) Mode Builder(3) Model Builder(3) MySQL(10) Native Apps(5) News(18) OAuth(9) OAuth Scopes(1) OAuth2(13) Offline(20) Offline Apps(4) Offline Sync(5) Oracle(11) PKCE(2) Postgre SQL(1) PostgreSQL(2) PWA(2) QR codes(2) Rapid Application Development(5) Reading Pane(2) Release Notes(183) Reports(48) REST(29) RESTful(29) RESTful Workshop(15) RFID tags(1) SaaS(7) Security(81) SharePoint(12) SPA(6) SQL Anywhere(3) SQL Server(26) SSO(1) Stored Procedure(4) Teamwork(15) Tips and Tricks(87) Tools for Excel(2) Touch UI(93) Transactions(5) Tutorials(183) Universal Windows Platform(3) User Interface(338) Video Tutorial(37) Web 2.0(100) Web App Generator(101) Web Application Generator(607) Web Form Builder(40) Web.Config(9) Workflow(28)
Archive
Blog
Tutorials
Friday, September 21, 2012PrintSubscribe
Implementing a Custom Action

Let’s implement a custom action that will apply a discount to all line items of a specific order. Orders are stored in the table Orders, and line items are stored in Order Details.

Relationship between Orders and Order Details tables in the Northwind database.

Adding a Custom Action

First, an action needs to be defined in the action group of a data controller.

Start the Project Designer. In the Project Explorer, switch to the Controllers tab. Right-click on Orders / Actions / ag4 (ActionBar) – Edit/Delete action group node, and press New Action.

New Action context menu option for action group 'ag4' of Orders controller.

Assign the following values:

Property Value
Command Name Custom
Command Argument ApplyDiscount
Header Text Apply a Discount
When Key Selected Yes
Confirmation _controller=OrderDiscount
_title=Specify a Discount
_width=500

Press OK to save the action.

The Confirmation property references a data controller called “OrderDiscount”. This data controller does not exist in the project – we will create this confirmation data controller from scratch and have it configured to collect the Discount value from the user. The data controller will not be based on any database table or view.

Creating the Confirmation Controller

On the Project Explorer toolbar, press the New Controller icon.

New Controller context menu option on the Project Explorer toolbar.

Give this controller a name:

Property Value
Name OrderDiscount

Press OK to save.

Right-click on OrderDiscount / Fields node, and press New Field.

New Field context menu option for OrderDiscount controller.

Assign the following values:

Property Value
Name CustomerCompanyName
Type String
Length 50
The value of this field is calculated by a business rule expression.
True
Label Customer Company Name
Values of this field cannot be edited True

Press OK to save.

Add another field with these values:

Property Value
Name Discount
Type Single
Label Discount

Save the field.

Generate the app and select an order. On the action bar, press the Apply a Discount action.

Custom action 'Apply a Discount' accessible on the action bar of Orders grid view.

A modal form with two empty fields, Customer Company Name and Discount, will be displayed.

ApplyDiscount confirmation modal window with empty values in fields 'Customer Company Name' and 'Discount'.

Let’s populate Customer Company Name with the name of the company associated with the selected order and initialize Discount with the average discount of the order details.

In the Project Explorer, right-click on OrderDiscount / Business Rules node, and press New Business Rule.

New Business Rule context menu option for OrderDiscount confirmation controller.

Assign the following values:

Property Value
Type SQL
Command Name New
Phase Execute
Script
set @CustomerCompanyName = @Context_CustomerCompanyName

select @Discount = avg(Discount) 
from "Order Details"
where OrderID = @Context_OrderID

Press OK to save the business rule.

The parameter @CustomerCompanyName refers to the CustomerCompanyName field of the confirmation data controller.

The parameter @Context_CustomerCompanyName refers to the CustomerCompanyName field of the Orders data controller.

The application framework will pass the script for execution to the database engine when the action Custom / ApplyDiscount is activated by the user. The result is shown in the next screenshot.

Specify a Discount modal confirmation window with average discount.

If the user clicks OK, nothing will happen. The application does not know what to do with a “Custom” action with argument of “ApplyDiscount”.

Creating an SQL Business Rule to Handle the Action

Now that an action and controller are in place to capture the user input, a business rule needs to be created to apply the specified discount to all OrderDetails data rows associated with the selected order.

Right-click on Orders / Business Rules node, and press New Business Rule.

New Business Rule context menu option for Orders controller.

Use these values:

Property Value
Type SQL
Command Name Custom
Command Argument ApplyDiscount
Phase Execute
Script
-- apply discount to order details
update "Order Details"
set Discount = @Parameters_Discount
where OrderID = @OrderID

-- force refresh of child views
set @Result_RefreshChildren = 1

Press OK to save.

The first statement in the SQL script will update [Order Details].[Discount] column where the OrderID matches the selected order. The value of the discount is referenced by @Parameters_Discount parameter.

The second statement instructs the client library to refresh the child data views of the master data view Orders. This will cause Order Details data view to reflect the updated discount.

On the Project Designer toolbar, press Browse. Navigate to the Orders page and select an order. A list of related order details will be displayed below. Take note of the discounts of the order details.

Selecting an order from the list will reveal a list of order details related to the order.

On the action bar of Orders grid view, press Apply a Discount. The confirmation modal popup will appear, displaying the current Customer Company Name and the average discount. Enter a discount of “.25”.

Discount has been specified in the confirmation modal popup.

Press OK, and the specified discount will be applied to all records in Order Details table that belong to the selected order.

Order Details have all been updated with the new discount.

Creating “Code” Business Rule to Handle the Action

Instead of using SQL, you may also create a code business rule written in C# or Visual Basic to handle the calculation.

If you have implemented the previous SQL business rule, you will need to delete it.

Right-click on Orders / Business Rules / Custom, ApplyDiscount (Sql / Execute) - r100 business rule node and press Delete.

Delete context menu option for the previously created SQL business rule.

Right-click on Orders / Business Rules node and press New Business Rule.

New Business Rule context menu option for Orders controller in the Project Explorer.

Assign these values:

Property Value
Type C# / Visual Basic
Command Name Custom
Command Argument ApplyDiscount
Phase Execute

Save the rule. “Code” business rules do not have a script stored in the data controller definition file. A code file must be created in the project. The application generator will create an initial “empty” business rule code file as soon as the project is generated.

On the Project Designer toolbar, press Generate.

When complete, right-click on Orders / Business Rules / Custom, ApplyDiscount (Code / Execute) – r100 node and press Edit Rule in Visual Studio.

Context menu option 'Edit Rule in Visual Studio' for the code business rule.

The file will be opened in Visual Studio. The generator has created a template for the business rule. Replace the existing code with the following:

C#:

using System;
using MyCompany.Data;

namespace MyCompany.Rules
{
    public partial class OrdersBusinessRules : MyCompany.Data.BusinessRules
    {

        /// <summary>
        /// This method will execute in any view for an action
        /// with a command name that matches "Custom" and argument that matches "ApplyDiscount".
        /// </summary>
        [Rule("r100")]
        public void r100Implementation(
                    int? orderID,
                    string customerID,
                    string customerCompanyName,
                    int? employeeID,
                    string employeeLastName,
                    DateTime? orderDate,
                    DateTime? requiredDate,
                    DateTime? shippedDate,
                    int? shipVia,
                    string shipViaCompanyName,
                    decimal? freight,
                    string shipName,
                    string shipAddress,
                    string shipCity,
                    string shipRegion,
                    string shipPostalCode,
                    string shipCountry)
        {
            // This is the placeholder for method implementation.
            using (SqlText applyDiscount = new SqlText(
                "update [Order Details] " +
                "set Discount = @Discount " +
                "where OrderID = @OrderID"))
            {
                applyDiscount.AddParameter("@Discount", SelectFieldValue("Parameters_Discount"));
                applyDiscount.AddParameter("@OrderID", orderID);
                applyDiscount.ExecuteNonQuery();
            }
            Result.RefreshChildren();
        }
    }
}

Visual Basic:

Imports MyCompany.Data
Imports System
Imports MyCompany.Rules

Namespace MyCompany.Rules

    Partial Public Class OrdersBusinessRules
        Inherits MyCompany.Data.BusinessRules

        ''' <summary>
        ''' This method will execute in any view for an action
        ''' with a command name that matches "Custom" and argument that matches "ApplyDiscount".
        ''' </summary>
        <Rule("r100")> _
        Public Sub r100Implementation( _
                    ByVal orderID As Nullable(Of Integer), _
                    ByVal customerID As String, _
                    ByVal customerCompanyName As String, _
                    ByVal employeeID As Nullable(Of Integer), _
                    ByVal employeeLastName As String, _
                    ByVal orderDate As Nullable(Of DateTime), _
                    ByVal requiredDate As Nullable(Of DateTime), _
                    ByVal shippedDate As Nullable(Of DateTime), _
                    ByVal shipVia As Nullable(Of Integer), _
                    ByVal shipViaCompanyName As String, _
                    ByVal freight As Nullable(Of Decimal), _
                    ByVal shipName As String, _
                    ByVal shipAddress As String, _
                    ByVal shipCity As String, _
                    ByVal shipRegion As String, _
                    ByVal shipPostalCode As String, _
                    ByVal shipCountry As String)
            'This is the placeholder for method implementation.
            Using applyDiscount As SqlText = New SqlText(
                    "update [Order Details] " +
                    "set Discount = @Discount " +
                    "where OrderID = @OrderID"
                    )
                applyDiscount.AddParameter("@Discount", SelectFieldValue("Parameters_Discount"))
                applyDiscount.AddParameter("@OrderID", orderID)
                applyDiscount.ExecuteNonQuery()
            End Using
            Result.RefreshChildren()
        End Sub
    End Class
End Namespace

Save the file, and refresh the web page. The Assign a Discount action will function in exactly the same way as the version with the SQL business rule.

Friday, September 7, 2012PrintSubscribe
Creating Many-to-Many Fields

The Northwind database features a many-to-many relationship between Territories and Employees.

Many-to-many relationship between Employees and Territories.

The app generator will create a page for EmployeeTerritories that allows editing records directly.

Employee Territories page allows setting up relationships between employees and territories directly.

EmployeeTerritories is also available as a child data view on the Employees page. Selecting an employee will reveal a list of related territories.

Employee Territories child data view allows editing territories associated with the selected employee.

Let’s create a many-to-many field on the employee edit form that will allow selecting territories in a check box list. Each option in the list will represent a territory from the Territories table. The checkbox next to the territory name will be checked if there is a record in the EmployeeTerritories table linking the selected employee with the territory. The relevant EmployeeTerritories records will be inserted or deleted when the user changes the selection of checkboxes and saves the employee record.

Start the Project Designer. In the Project Explorer, switch to the Controllers tab. Right-click on Employees / Fields node, and press New Field.

New Field context menu option for Employees controller.

Give this field the following values:

Property Value
Name Territories
Allow null values true
The value of this field is computed at run-time by SQL expression. true
Label Territories
Items Style Check Box List
Items Data Controller Territories
Data Value Field TerritoryId
Data Text Field TerritoryDescription
Target Controller EmployeeTerritories

Press OK to save the field.

Drag Employees / Fields / Territories field node onto Employees / Views / editForm1 view node.

Dragging Territories field node onto 'editForm1' view node.

Double-click on Employees / Views / editForm1 / Territories data field node.

Territories data field node in editForm1 view of Employees controller.

Change the Columns property:

Property Value
Columns 5

Press OK to save. Switch to the Pages tab. Right-click on Employees page node, and press View in Browser.

View in Browser context menu option for Employees page.

View the details for an employee. Territories field will display a comma-separated list of values associated with the employee.

Territories many-to-many field will render a comma separated list of values.

Press Edit button. All territories will be rendered as a check box list.

When the form is in edit mode, all territories are rendered in a check box list.

Check or uncheck several values, and press OK to save the record. Select the record to verify that the changes were persisted.

Changing the Child Views

The Employee Territories child data view is now unnecessary.

Switch back to the Project Designer. In the Project Explorer, right-click on Employees / container2 / view4 node, and press Delete.

Delete context menu option for 'view4' on Employees page.

Drag view3 node on the left side of view2 to place it in the first position.

Dragging 'view3' view node on the left side of 'view2' view node.     View 'view3' has been placed before 'view2'.

Right-click on Employees page node, and press View in Browser.

View in Browser context menu option for Employees page node in the Project Explorer.

Select an employee from the list, and the Orders and Employees child data view tabs will appear below. The Employee Territories child data view tab is no longer present. The picture also shows the many-to-many field Territories in the master grid view.

Employees page no longer has the Employee Territories data view.

Friday, September 7, 2012PrintSubscribe
Configuring Charts

Let’s create a chart that will graphically present orders broken down by quarter.

Creating the View

Start the Project Designer. In the Project Explorer, activate the Controllers tab. Right-click on Orders / Views node, and press New View.

New View context menu option for Views node of the Orders controller in the Project Explorer.

Give this view the following properties:

Property Value
Id OrdersByQuarter
Type Chart
Label Orders By Quarter

Press OK to save the view.

A chart requires at least two fields. One field will represent the values, and the other will form the x-axis of the chart that will group values by a certain criteria. A chart may have more than one field representing values.

For example, to display a chart of orders grouped by quarter, the OrderID field will represent values and OrderDate will represent the x-axis.

In the Project Explorer, expand the Orders / Fields node. Using Ctrl key, select OrderID and OrderDate fields, and drag them onto Orders / Views / OrdersByQuarter view node.

Dragging 'OrderID' and 'OrderDate' field nodes onto 'OrdersByQuarter' view node.

This will create two data fields. Double-click Orders / Views / OrdersByQuarter / OrderID data field node.

'OrderID' data field in 'OrdersByQuarter' view node of Orders controller.

Assign the following values:

Property Value
Aggregate Count
Chart Bar (Cylinder)

Press OK to save the data field. Double-click Orders / Views / OrdersByQuarter / OrderDate data field node.

'OrderDate' data field in 'OrdersByQuarter' view node of Orders controller.

Assign these values:

Property Value
Data Format String MMM yyy
Chart X, Quarter

Press OK to save.

Viewing the Results

On the Project Designer toolbar, press Browse.

Navigate to the Order Manager page. Select a customer from the first data view. Use the View Selector in the top right corner of Orders data view to switch to Orders By Quarter view.

Using the View Selector to change the view to 'Orders By Date'.

The chart will be displayed, showing the number of orders in each quarter filtered by the selected customer.

Orders By Date chart displayed in the Orders data view.

If you select another customer, the orders will change to reflect the new selection.

Selecting a different customer will change the filtering options for the chart.