Features

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
Features
Wednesday, April 24, 2013PrintSubscribe
Azure Upload/Download Adapter

Microsoft Azure Storage is a low-cost option that allows storing binary content in the cloud. Let’s implement storing of product pictures in the Northwind sample database. We will capture name, size, and content type of the picture file in the Products table. The actual pictures will be saved in Microsoft Azure Storage.

Setting Up Azure Storage

Navigate to http://azure.com and click on the Portal link in the top right corner to log in to your Azure account. If you do not have an account, a free three month trial is offered.

When the Management tool loads, click on the New button in the bottom left corner. Select Data Services | Storage | Quick Create option. Assign a URL for your new storage and press Create Storage Account.

Creating a new storage account in Windows Azure.

When complete, click on the new storage account name in the list to view details. On the action bar displayed at the bottom, press Manage Access Keys. Copy one of the keys into the clipboard.

Viewing Access Keys for Azure Storage account.

At the top of the form, click on Containers tab. Press Add Container at the bottom of the screen.

Adding a container to a storage account.

Assign a name to the container. If you do not expect the product pictures to be accessible to anonymous users, then leave Access property as “Private”. Click on the Check icon to save.

Creating a new container.

Adding Utility Fields to the Database

Start SQL Server Management Studio. In the Object Explorer, right-click on Databases / Northwind / Tables / dbo.Products, and press Design.

Designing the dbo.Products table in Northwind database.

Add the following columns:

Column Name Data Type Allow Nulls
PictureFileName nvarchar(250) yes
PictureLength int yes
PictureContentType nvarchar(50) yes

Save the changes. Switch to the generator and click on the project name. Select Refresh, check the box next to Products controller, and proceed to refresh the web app.

Refreshing the Products controller.

Configuring BLOB Field

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

Adding a new field to Products controller.

Assign the following properties:

Property Value
Name Picture
Type Byte[]
Allow Null Values yes
Value is retrieved on demand yes
Source Fields ProductID
On Demand Handler PictureBlobHandler
On Demand Style Thumbnail
Label Picture

Save the field. Drag the new field node and drop it onto Products / Views / editForm1 to instantiate the field as a data field in the editForm1 view.

Instantiating the Picture field in view 'editForm1'.     'Picture' data field created in 'editForm1' view.

Drag the field onto view grid1 to display the picture in the list of products.

Next, double-click on the Products controller node. Enter the following in BLOB Adapter Configuration.

BLOB Adapter Configuration

Field: Picture
Storage-System: Azure
Account: northwindproductpictures
Container: pics
Key: e2Wl668b6fEGauS6cOTAHaj7Ut6QfwKdbGY4Vd8yngz40y2f54M5EfZtSNNHYoXW7i7+kZAfFJrg==
Path-Template: Products/{ProductID}-{PictureFileName}

Note that the values above are not functional. Replace the highlighted parts with your own settings.

Make sure to save the controller.

Viewing the Results

On the toolbar, press Browse. Navigate to the Products page, and edit any record. Note that there is a Picture field which accepts files. Click on the link to upload a file and select a picture from your hard drive. A bar at the top of the page will announce completion of upload and the thumbnail of the picture will be displayed. The utility fields will be updated with the picture file name, length, and content type. If you do not want users to change any utility field values, configure the data fields as Static.

Succesful upload of product picture to Azure.

The thumbnail will display the file extension if the file is not an image.

Extension displayed in thumbnail when file is not an image.

The uploaded files are visible in Azure Management screen.

Files are visible in Azure Management tool.

To upload files larger than 4 MB, you will need to increase the application upload size limit.

Wednesday, February 27, 2013PrintSubscribe
Enabling Second Generation Data Sheet Preview

Starting with release 7.0.7.0, web applications created with Premium or Unlimited edition include a preview of the second generation data sheet view. The new implementation supports horizontal and vertical scrolling, column resizing, and freezing. In addition, applications based on Microsoft SQL Server or Oracle also support hierarchical presentation of data.

The preview does not yet support all capabilities available in the original data sheet. The missing features will be released as soon as they become production-ready. Therefore, the second generation data sheet is disabled by default. If you would like to take it for a spin, make sure to regenerate your web app and follow the instructions below.

Start the web application generator. Create a sample Northwind web app. When generation is complete, click on the project name in the start page of the generator. Then, click Develop to open the project in Visual Studio.

In the Solution Explorer, right-click on ~\App_Code folder, and press Add | Add New Item…

image

Select Class from the list, and assign a name. Press Add to create the file.

image

Replace the existing code base with the following:

C#:

namespace MyCompany.Data
{
    public partial class ControllerUtilities
    {
        public override bool SupportsScrollingInDataSheet
        {
            get { return true; }
        }
    }
}

Visual Basic:

Namespace MyCompany.Data
    Partial Public Class ControllerUtilities
        Public Overrides ReadOnly Property SupportsScrollingInDataSheet As Boolean
            Get
                Return True
            End Get
        End Property
    End Class
End Namespace

Save the file and run the web app. Navigate to the Customers page. On the action bar, press Action | Show in Data Sheet.

image

The grid view will render the second generation data sheet.

image

The second generation data sheet will be enabled by default when the feature set of the previous implementation is replicated.

To use the original data sheet view implementation, make sure that the SupportsScrollingInDataSheet property of class ControllerUtilities returns false.

Wednesday, February 27, 2013PrintSubscribe
EASE Geo Tagging

Some projects require that a location must be recorded when a new order is made or whenever a record is modified. Code On Time client library will automatically request the latitude and longitude from the browset with the use of tags on the data field level.

For example, let’s consider the Northwind sample database. When a new order is created, we would like to save the location. Let’s add two pairs columns to the Orders database table, refresh the Orders controller, and tag these fields as coordinates.

Adding Latitude and Longitude to Orders Table

Start SQL Server Management Studio. In the Object Explorer, right-click on Databases / Northwind / Tables / dbo.Orders node, and press Design.

Designing the Orders table of the Northwind database.

Add four more columns with the following values:

Column Name Data Type Allow Nulls
CreatedLatitude nvarchar(50) yes
CreatedLongitude nvarchar(50) yes
ModifiedLatitude nvarchar(50) yes
ModifiedLongitude nvarchar(50) yes

Save the design to add the columns to the table.

Refreshing Orders Controller

Start the web app generator. Click on the project name, and press Refresh. Check the box next to Orders controller, and click Refresh.

Refreshing the Orders controller.

Tagging the Data Fields

Press Design to activate the Project Designer. In the Project Explorer,  switch to the Controllers tab. Double-click on Orders / Views / editForm1 / c1- Orders / CreatedLatitude (String(50)) data field node.

'CreatedLatitude' data field of view 'editForm1' in the Orders controller.

Add a tag to the data field:

Property New Value
Tags created-latitude

Press OK to save. Double-click on Orders / Views / editForm1 / c1- Orders / CreatedLongitude (String(50)) data field node.

'CreatedLongitude' data field of view 'editForm1' in the Orders controller.

Add the following tag:

Property New Value
Tags created-longitude

Save the data field. Double-click on Orders / Views / editForm1 / c1- Orders / CreatedLongitude (String(50)) data field node.

'ModifiedLatitude' data field of view 'editForm1' in the Orders controller.

Use this tag:

Property New Value
Tags modified-latitude

Save the item. Double-click on Orders / Views / editForm1 / c1- Orders / ModifiedLongitude (String(50)) data field node.

'ModifiedLongitude' data field of view 'editForm1' in the Orders controller.

Use this tag:

Property New Value
Tags modified-longitude

Save the data field.

Now, repeat the steps above to assign the correct tags to the relevant data fields in createForm1 view.

It is also possible to store latitude and longitude in the same field in the form “[latitude],[longitude]” by using the tags “created-coords” and “modified-coords.”

Viewing the Results

On the toolbar, press Browse. Navigate to the Orders page. Create a new record. A request for permission will be triggered – every browser will display it differently.

Internet Explorer 9 requesting permission for the site to track physical location.

Allow the website location request for the session or site. Press Cancel and open the create form again. Both sets of coordinates will be updated. Note that the data fields are read-only.

All coordinate fields are updated with the values supplied by the browser.

Save the record and edit the record again. Note that only Modified Latitude and Longitude values are changed.

"Modified" coordinates updated with the values supplied by the browser.