AppFrame

Client Side Framework

This article will give you a brief introduction to the new Web3 client side framework, which will hopefully help you on your way to creating your first client side project.

Before you can start developing web applications using the AppFrameR3 framework you will need to prepare your computer. The following needs to be downloaded and installed before starting:

AppFrame Controls

afDataService

afDataService is the foundation of the client side framework. afDataService is a webservice which contains data methods. In the afDataService design view, you can add a Web3 ClientSide afDataSource. If you have worked with CR3 prior, you will recognize the design time editor of the afDataSource. Using the editor you can design your select query as well as setting up eventual master-child relationships. To use the afDataService you must connect it to the page using an afScriptManager.

All controls are based on telerik controls, so please visit telerik.com for general purpose tips and tricks. Examples of commonly used properties and javascript functions are listed below.

afBaseGrid Properties

Name Purpose
DataSourceName Name of DataSource
DetailPanel ID of the panel to display details
KeyFieldName Gives the views unique identifier. Must be identical in DataSource
EditPanel ID of the relevant afEditWindow
MasterGridId MasterGrid Id. When set, child grids are automaticly updated when master grid row is selected
AdjustHeightOnResize Boolean value, default false
ResizeHeightBy Integer giving the amount of pixels to adjust
LoadOnPageLoad Specify whether grid should be loaded on page load, set to false if you need a custom load
OnFirstRowSelected Triggered when top row is selected
OnRowSelected Triggered when row is selected
DeleteFunction Used when you need a custom delete web method
DeleteRequestData Name of js function

Javascript

Name Purpose
{id}_LoadGrid() Loads grid
{DataSourceName}_Save/Update/Delete() The grid’s data functions
{id}_getTableView() Gets the MasterTableView object
{id}_GetDataSourceName() Gets the DataSource name

afLabel Properties

Name Purpose
DateFormat Date format string

afFileHandler Properties

Name Purpose
CheckedOutByFieldName The checkedOutBy field name, default is “CheckedOutByName”
CheckOutDateFormatString Date format string of grid column
UploadPanel ID of the relevant afFileHandlerWindow. If empty, new browser window is opened
RequiredFields Inner property. Define extra fields needed for insert, and js script to get value
ViewName File view name
EnableFileCheckOut Adds file checkout functionality. This Requires the following fields: FileName, CheckedOutBy and CheckedOutByMe bit field.

afGridLookup Properties

Name Purpose
OnOpen Triggered when lookup window is opened.
OnClientSelectedIndexChanged Triggered when lookup value is selected.

Javascript

Name Purpose
{id}_GetValue() Retrieves the datavalue
{id}_SetValue(a) Sets the datavalue
{id}_GetText() Retrieves the text
{id}_SetText(a) Sets the text
{id}_SetFilter(a) Sets the GridLookup’s filter

afSearchPanel Properties

Name Purpose
GridName Id of the grid the search panel will search
ShowNumberOfRecords Enables the search panel to show the total amount of records

afEditWindow Properties

Name Purpose
OnOpened Specify a function to be called when window is opened