Blog: Posts from October, 2012

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
Posts from October, 2012
Friday, October 19, 2012PrintSubscribe
Getting Started: Refreshing Project Settings

At some point during web application development with Code On Time, it may be required to change universal project configuration settings, add a table, or update an existing table definition. However, the web application generation process will not change the application pages and controllers without a project refresh.

Changing a Project Setting

Let’s change the layout of our project to Stacked, and change the theme to Social.

Start the web application generator. Click on the project name, and select Settings.

Settings option on a Project Actions page in Code On Time web app generator.

Click on Layouts option on the next screen.

Layouts option for Project Settings.

On the Layout page, select Stacked from the list, and press Next.

Layout has been changed to Stacked.

From the list of themes, select Social.

The theme has been changed to Social.

Press Finish to skip to the Summary page. Activate the Refresh option, and the Refresh screen will open.

Refreshing the web application. None of the controllers have been selected.

Only application configuration has been changed – it is not necessary to select any of the controllers. Press Refresh, and confirm.

Confirming refresh of the project.

When the application finishes recreating the baseline, click on Generate and wait for the web application to start in your default browser.

The new theme and layout will be applied.

Note that if any changes were made to page configuration elements, the layout will not be changed in order to preserve user modifications.

Employees page with Stacked layout.

Adding a Table

Let’s add the Region table to the web application.

Switch to the web app generator and click on the project name. Select Refresh option.

Refresh option on the Project Actions page.

In the bottom left corner of the Refresh screen, select Change Tables / Views… option.

Refresh window with 'Change Tables / Views...' option highlighted.

Check the box next to dbo.Region table, and press OK.

Region table added to the database.

The list of objects in the Refresh screen will be updated with the Region table checked.

Region table to be added to the application after refresh.

Press Refresh and confirm to refresh the project. Continue to generate the project.

A Region page has been added to the web application displaying a list of regions.

Note that the menu layout has been changed to include Region. If any changes were made to the application pages in the Project Designer, the existing menu layout will not be changed and Region will be appended to the end of the site map under a New Pages menu.

Region page added to the web application.

Updating a Controller Definition

Let’s add a URL field to the Suppliers table.

Open Microsoft SQL Server Management Studio and connect to your database. In the Object Explorer, right-click on Databases / Northwind / Tables / dbo.Suppliers node, and press Design.

Design context menu option for Suppliers table node in the Object Explorer.

Add the following column:

Column Name Data Type Allow Nulls
URL nvarchar(200) True

Save the table and switch back to the web app generator. Click on the project name and select Refresh option. Check the box next to Suppliers controller, and press Refresh.

Refreshing the Suppliers controller.

Continue to generate the web app. When it loads in your browser, navigate to the Suppliers page and edit a record. The URL field has been added to the form.

Suppliers edit form with Url field added to the bottom.

Friday, October 19, 2012PrintSubscribe
Order Form Sample–Part 9

When creating a new order, the first item that will be entered will probably be the customer. Due to the denormalized nature of Northwind database, the customer information is stored in the table Customers, and the Orders table references a customer via a foreign key field CustomerID. Upon creating a new order, it would be convenient if the user were prompted to either select an existing customer or create a new one. When the customer is selected, the shipping information should be copied from the customer to the order.

Switch back to the Designer. In the Project Explorer, double-click on Order Form / c101 / view1 / grid1 / CustomerID –> CustomerCompanyName / CustomerID (String(5)) field reference node.

CustomerID field reference node under the CustomerID data field of grid1 view.

Enter the following settings for CustomerID:

Property New Value
Data Value Field CustomerID
Data Text Field CompanyName
Copy

ShipName=ContactName
ShipAddress=Address
ShipCity=City
ShipRegion=Region
ShipPostalCode=PostalCode
ShipCountry=Country

Search on Start true
Activate If Blank true
Lookup Window Description Select a customer.

Press OK to save the field.

When the customer has been selected, we’d want the application to prompt the user to select the employee handling the order. To make this part easier, let’s add photos of each employee in the lookup.

In the Project Explorer, double-click on Order Form / c101 / view1 (Orders) / grid1 / EmployeeID –> EmployeeLastName / EmployeeID (Int32) field reference node.

EmployeeID field reference node under the EmployeeID data field of grid1 view.

Change the following settings for EmployeeID:

Property New Value
Activate If Blank true
Lookup window description Select an employee.

Press OK to save the record.

Switch to the Controllers tab at the bottom of the Project Explorer. Expand the Fields and Views nodes of Employees controller. Drag and drop Employees / Fields / Photo (Byte[]) field node onto Employees / Views / grid1 view node.

Dropping the Photo field node onto 'grid1' view node.     A Photo data field has been created in 'grid1' view.

On the Project Designer toolbar, press Browse, and wait for the application to load. Navigate to the Order Form page, and press New Orders on the action bar. You will be prompted to select a customer.

When a new order is created, a lookup will open that will prompt selection of a customer.

When you search for and select a customer, you will then be prompted to select an employee. You can see the photo for each employee as well.

Lookup screen prompting selection of an employee. The photo for each employee is displayed.

Select the employee, and you will see that the shipping fields have been populated from the selected customer.

New Orders form with Customer and Employee selected. Shipping information from the customer has been copied over.

Friday, October 19, 2012PrintSubscribe
Order Form Sample–Part 8

Now that the Order Form page has been set up, we will want to customize several settings. First, we shall optimize the Orders controller. The list of order is currently displayed in alphabetical order of Customer Company Name. It would make more sense to sort the orders according to the date the order was made.

Switch back to the Designer. In the Project Explorer, double-click on Order Form / c101 / view1 (Orders) / grid1 data view node.

View 'grid1' of Orders data controller, accessed view data view 'view1' on the Order Form page.

Change the Sort Expression to the following:

Property New Value
Sort Expression OrderDate desc

Press OK to save the view. On the toolbar, press Browse to regenerate the application. If you navigate to Order Form page, you will see that the orders are sorted in descending order of Order Date.

The list of orders has been sorted in descending order of Order Date.