User Interface

Labels
AJAX(112) App Studio(8) 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(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(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
User Interface
Sunday, July 1, 2012PrintSubscribe
Feature: Automatic Tracking of Selected Record

Applications automatically keep track of the selected record when users page, sort, filter, or modify data.

For example, the product “Chang” has been selected on the second page of the list.

Sort by Product Name and filter to 'Beverages' in Category Name.

Filter Category Name by “Beverages”, and sort in descending order of Product Name.

Sort by Product Name, and filter to 'Beverages' in Category Name.

The grid will display page three with product “Chang” selected in the view.

The data view paged to and selected Chang record.

Clear the filter. The data view will display page two and with “Chang” still selected in it.

Clearing the filter will navigate back to page 2 and still have Chang selected.

Sort the Unit Price field in ascending order. The data view will preserve the selection by navigating to page eight.

Sorting by Unit Price will move Chang record to page 8. The record selection will be preserved.

The application framework automatically locates the page that the data row belongs to while taking into account the sort order and filters. This behavior is automatic – it requires no programming.

Developers can take advantage of this application framework feature. For example, an application can select a page of data that contains a specific record in response to user actions.

image

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.

Monday, June 25, 2012PrintSubscribe
Maximum Value Count

Field samples, multi value filters, and search bar auto complete entries display up to 200 related lookup items.

Supplier Company Name multi value select with 29 items available for selection.

Let’s change the maximum number of lookup items displayed for Supplier Company Name of Products controller.

Start the web application generator. Click on the project name, and select Develop option. Visual Studio will start.

In the Solution Explorer, right-click 0n ~\App_Code folder, and select Add New Item.

Add New Item to AppCode folder of your web application. 

Select Class item from the list, and press Add.

Create a class in Microsoft Visual Studio.

Replace the entire sample content of the file with the following:

C#:

using System;
using System.Web;
namespace MyCompany.Data
{
    public partial class DistinctValueRequest
    {
        public override int MaximumValueCount
        {
            get
            {
                if (Controller == "Products")
                {
                    if (FieldName == "SupplierCompanyName")
                        return 10;
                    else
                        return 20;
                }
                return base.MaximumValueCount;
            }
            set
            {
                base.MaximumValueCount = value;
            }
        }
    }
}
Visual Basic:
Imports Microsoft.VisualBasic
Imports System
Imports System.Web

Namespace MyCompany.Data
    Partial Public Class DistinctValueRequest
        Public Overrides Property MaximumValueCount As Integer
            Get
                If Controller = "Products" Then
                    If FieldName = "SupplierCompanyName" Then
                        Return 10
                    Else
                        Return 20
                    End If
                End If
                Return MyBase.MaximumValueCount
            End Get
            Set(value As Integer)
                MyBase.MaximumValueCount = value
            End Set
        End Property
    End Class
End Namespace

This class will instruct the application framework to use 20 distinct value samples for all fields in the Products controller with the exception of Supplier Company Name. The limit for Supplier Company Name is 10. No other controllers will be affected.

Save the class. On the keyboard, press Ctrl+F5 to start the web application. Navigate to the Products page.

Activate the Supplier Company Name header dropdown. Only the first 10 items will be available for selection.

10 samples displayed for Supplier Company Name filter.

Open the advanced search bar, and activate the Auto Complete dropdown for Supplier Company Name. Only 10 items will be displayed at one time.

Advanced Search Bar auto complete dropdown only shows 10 items.

The Multi Value Filter window will only display 10 items.

Supplier Company Name multi value filter only shows 10 items.

Other fields in the Products controller will display 20 distinct value samples, such as the Quantity Per Unit header dropdown.

Quantity Per Unit distinct value sampleshow only 20 items.