Designer

Labels
AJAX(112) App Studio(9) 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(178) 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(184) 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(3) 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
Designer
Tuesday, September 4, 2012PrintSubscribe
Rearranging Data Fields

The application generator composes this view of Customers from the database.

Customers grid on the Order Manager page without any customization.

Let’s change some of the data fields presented in the view. For example, let’s move Phone data field next to Contact Name, remove the Region data field, and add Fax to the view.

Moving

Switch to the Project Designer. In the Project Explorer, activate the Controllers tab and expand to Customers / Views / grid1 data view node. Drag Phone data field and drop it on the right side of ContactName data field to place it after the target.

Dropping Phone data field on the right side of ContactName data field.     Phone data field has been placed after ContactName in the list of data fields in view 'grid1'.

Deleting

Right-click on Customers / Views / grid1 / Region data field node, and select Delete.

Delete context menu option on the Region data field.     Region data field has been removed from 'grid1' view.

Adding

Expand Customers / Fields node. Drag Fax field node onto Customers / Views / grid1 node to create a data field from the Fax field.

Dropping Fax field node onto 'grid1' view node will create a data field.     Fax data field has been created in view 'grid1'.

Switch to the Pages tab in the Project Explorer. Right-click on Order Manager page node, and press View in Browser.

View in Browser context menu option for Order Manager page node will generate the project and open the relevant page node.

The Customers grid with new column layout will be displayed. The Phone field is more conveniently placed next to the Contact Name. The Region field has been removed. Fax has been added.

The modified Customers grid.

Saturday, September 1, 2012PrintSubscribe
Allow Sorting

Fields automatically created by Code On Time generator have sorting enabled by default. However, if a calculated field is created by a developer, sorting must be explicitly allowed. Ability to sort may also be disabled on any field.

For example, the Employees grid view below has been configured to display a calculated field called Full Name. When you mouse over the Full Name column header, it is rendered as text and there is no dropdown available for filtering or sorting operations.

Sorting is not enabled for Full Name calculated field. The Full Name column header is not clickable and has no context menu.

Let’s allow sort operations on the field.

Start the Project Designer. In the Project Explorer, switch to the Controllers tab and double-click on Employees / Fields / FullName field node.

FullName field node in Code On Time web application Project Explorer.

Enable sorting.

Property New Value
Allow Sorting true

Press OK to save the field. On the toolbar, press Browse.

Navigate to the Employees page. Mouse over the Full Name header – it will be rendered as a link, and a dropdown menu will be available with sorting options.

FullName column header has sorting enabled and displays a context menu with sorting options.

Clicking on the column header text once will activate the first sorting option.

Full Name with A-Z sorting activated.

Clicking on the text again will activate the second option.

Full Name with Z-A sorting activated.

A sort can be deactivated by clicking on the sort option in the dropdown.

Largest on Top sorting option enabled for Full Name column.

Saturday, September 1, 2012PrintSubscribe
Working with Categories in Designer

Categories are used to group data fields in form views.

In the Project Designer, categories can be found on the Categories tab of a view properties page.

Categories tab on the view properties page in the Project Browser.

Create new categories by using the action New | New Category on the action bar.

New Category action bar action in the Project Browser.

Category details can be viewed and edited by clicking on the Header Text link or using the context menu option Open.

Open context menu option in the Project Browser.

The Sync context menu option will select the relevant category node in the Project Explorer.

Sync context menu option in the Project Browser.      Relevant category node has been selected in the Project Explorer.

The category Id can be changed using Rename context menu option in the Project Explorer.

Rename context menu option for a category in the Project Explorer.     Category in Rename mode allows the user to change the Id in the Project Explorer.

Categories can be quickly found using the Navigate To window.

Navigate To widow allows direct navigation to the category.

Move and arrange categories using drag and drop commands in the Project Explorer.

Dropping 'Order Details' category on the right side of 'Reference Information' category.     'Order Details' category has been moved after the drop target.

Categories can be removed using the Delete context menu option.

Delete context menu option for a category in the Project Explorer.