Web Application Generator

Blog
Web Application Generator
Friday, December 15, 2017PrintSubscribe
Data Field Tag: Overview

The data field Tags property is a space-separated list of values used by the client library to automatically add enhanced functionality at run-time. The table below shows available values and their related function.

Value Function
action-call
action-call-disabled
Will render a Call action to activate the device’s dialer application to make a call to the field value. The “disabled” tag will disable the automatic Call action.
action-email
action-email-disabled
Will render an Email action to open the device’s emailing application to send an email to the field value. The “disabled” tag will disable the automatic Email action.
action-url
action-url-disabled
Will render a Link action to treat the field value as a URL. The “disabled” tag will disable the automatic URL action.
calendar-date The primary date field to be used for Calendar presentation style.
calendar-end The “end” date field to determine date range in Calendar presentation style. In forms, will also configure the calendar input to automatically jump to this field from the “calendar-date” field and only allow date values in the future relative to the “calendar-date” field to be selected.
calendar-color The value field that will assign colors to each record.
calendar-text The field will be used as the primary displayed text in an event in Calendar presentation style.
calendar-disabled Will disable calendar presentation style processing for this field.
calendar-input-disabled Will disable calendar input control for this field in Touch UI.
calendar-input-data-none Will disable automatic query of record counts displayed in the calendar input control.
calendar-input-future Only allows selecting date values in the future.
created-coords When a new record is created, the geolocation will be requested from the browser and saved into the field in the form “[latitude],[longitude]” (without brackets or quotation marks).
created-latitude When a new record is created, the latitude will be requested from the browser and saved into the field.
created-longitude When a new record is created, the longitude will be requested from the browser and saved into the field.
data-sheet-freeze The data field will be “frozen” when in second generation data sheet view. The user can still unfreeze the column by activating “Unfreeze” option in the column header dropdown.
header-image-original If the field is a BLOB, will render image as header in full quality.
header-text The value of this field (in grid1) will be displayed as the header in Touch UI forms.
import-duplicate-test When importing records, the process will search for records with matching values in fields with this tag. If it exists, it will skip this record.
import-duplicate-accept When importing records, the process will search for records with matching values in fields with this tag. If it exists, it will update the existing record.

hierarchy-parent

The foreign key data field will be used as the parent when creating and rendering a hierarchy in second generation data sheet view. Examples include: ManagerID, ReportsTo.
lookup-details-hidden Hides the lookup reference arrow in the user interface.
modified-coords When a record is modified, the geolocation will be requested from the browser and saved into the field in the form “[latitude],[longitude]” (without brackets or quotation marks).
modified-latitude When a record is modified, the latitude will be requested from the browser and saved into the field.
modified-longitude When a record is modified, the longitude will be requested from the browser and saved into the field.
lookup-details-hidden Will hide the lookup details arrow from the user to prevent direct access to the lookup record.
map-latitude
map-longitude
map-address
map-state
map-city
map-region
map-postalcode
map-zipcode
map-zip
map-country
Use both “map-latitude” and “map-longitude”, or at minimum “map-address” and “map-city” in order to enable Map presentation style in Touch UI.
map-none Will disable map processing for this data field.

Tags are also used to configure the Chart presentation style. All chart tags start with the keyword “pivotX”, with X being the ID of the pivot. Learn more about how to format chart tags.

These keywords must be combined with dashes “-” to form a tag. Note that keywords with “X” require an integer value replacing the X. If not specified, the default value is 0.

Note that keywords can be split into multiple tags. For example, specifying “pivot1-row1-area” will be equivalent to “pivot1-row1 pivot1-area”. Do not specify duplicate keywords for the same pivot.

Some keywords support specifying a string value. This keyword must be the last keyword of the tag. Format these keywords like the following:

pivot1-title:"This is the title"

The table below enumerates the available keywords.

Keyword Function
pivotX The integer value X determines the pivot ID that the properties will be applied to.
rowX The data field will be used as a row. The index of the row is X.
colX The data field will be used as a column. The index of the column is X.
valX The data field will be used as a value. The index of the value is X.
area
areastacked
bar
barstacked
candlestick
column
columnstacked
candlestick
donut
geo
map
line
pie
pie3d
scatter
table
This keyword determines the chart type. If this keyword is not specified on at least one tag referencing pivot X, then the pivot will not be rendered as a chart.
small
medium
large
Determines the default size for the chart in the user interface.
topX Only the top X number of rows or columns will be kept. The rest will be hidden.
other When used in combination with “topX”, the hidden rows or columns will be collapsed into an “Other” row or column.
date This keyword, used on a DateTime data field, will compose multiple pivots with different configurations. The pivots tested are: year, year/quarter, year/month, year/month/weekofyear, year/month/day. The pivot with the number of rows closest to 25 will be selected for use.
sum
min
max
avg
count
These keywords will determine the value that will be used when calculating cells.
timeofday
second
minute
halfhour
hour
day
dayofweek
weekofmonth
week
weekofyear
twoweek
month
quarter
year
These keywords determine the date bucket mode. The DateTime value will be parsed and use the relevant part of the date.
all Lookup data fields will select all distinct values from the database and ensure that all possible lookup values will be present in the row or column. DateTime data fields will make sure that each bucket between the first and last row or column will be present.
hideblank The “blank” row or column will be hidden.
sortasc
sortdesc
sortascbyval
sortdescbyval
Use the “sort” keyword to determine the sorting order for values of this row or column. Specify “sortasc” or “sortdesc” to sort the row or column alphabetically or numerically. Specify “sortascbyval” or “sortdescbyval” to sort the rows or columns numerically by the value itself.
maximize The chart will take the full allocated space in the view. Axis labels and titles will be displayed inside the chart area.
crosshair Crosshairs will be enabled for the supported graphs.
title
haxistitle
vaxistitle
Specify a string value to set the relevant title text.
format Specifies an ICU Decimal format string.  Supported .NET-compatible formats are “c”, “C”, “d”, “D”, “e”, “E”, “f”, “F”, “n”, “N”, “p”, “P”, “x”, “X”. 
region Specify a string value to set the region mode for “geo” chart.
displaymode Specify a string value to set the display mode for “geo” chart.
resolution Specify a string value to set the resolution for “geo” chart.
curve Enables curvature in the “line” chart.
explorer Enables zooming and panning in the “line” chart.
maptype Specify a string value to set the Map Type in “map” chart type.
enablescrollwheel Enables the scroll wheel for zooming in “map” chart type.
usemaptypecontrol Enables the Map Type control in “map” chart type.
pointshape Specify a string value to set the point shape.
pointsize Specify a value to set the point size.
orientation Specify a string value for the orientation of the chart.
animation Enables the loading animation.
grandtotal Will show a “Grand Total” row and column for the pivot. Not suggested to be used in conjunction with a chart.
Thursday, November 30, 2017PrintSubscribe
Changing Application Configuration

The file Web.config is the main settings and configuration database of a ASP.NET web application. The file is encoded in XML format. Code On Time generator automatically creates and configures the web.config file based on the selected project settings.

Every subsequent generation of the project will recreate the web.config file.

It may be necessary to change the web.config file to link custom component libraries or enter custom entries required for the project. The application generator allows specifying Web.Config modification instructions to manipulate the file contents.

Start the web application generator, click on the project name, and select Settings. Click on Web Server Configuration.

Web Server Configuration option on the Settings page of Code On Time web application generator.

The page of the wizard will have the Web.Config modification instructions textbox.

Web.Config modification instructions on the Web Server Configuration page.

AppendChild

The AppendChild modification instruction will add elements as children of the specified element, provided that the element exists.

For example, consider the /configuration/appSettings section of a Web Site Factory project.

<configuration>
  <appSettings>
    <add key="ChartImageHandler" value="storage=file;timeout=20;dir=c:\TempImageFiles\;" />
  </appSettings>
  ...
</configuration>

Insert the following snippet in the Web.Config modification instructions:

AppendChild: /configuration/appSettings

<add key="Setting1" value="Value1" />
<add key="Setting2" value="Value2" />

Generate the application. Open the web.config file, and find the new add elements. They were placed as children of /configuration/appSettings node.
<configuration>
  <appSettings>
    <add key="ChartImageHandler" value="storage=file;timeout=20;dir=c:\TempImageFiles\;" />
    <add key="Setting1" value="Value1" />
    <add key="Setting2" value="Value2" />
  </appSettings>
  ...
</configuration>

InsertBefore and InsertAfter

The InsertBefore modification instruction will add elements on the same level, before the specified node.

Append the previous modification instruction with the following snippet to insert the third add element before the second add element with key of “Setting1”:

InsertBefore: /configuration/appSettings/add[2]

<add key="Setting3" value="Value3" />

The web.config file will look like this:

<configuration>
  <appSettings>
    <add key="ChartImageHandler" value="storage=file;timeout=20;dir=c:\TempImageFiles\;" />
    <add key="Setting3" value="Value3" />
    <add key="Setting1" value="Value1" />
    <add key="Setting2" value="Value2" />
  </appSettings>
  ...
</configuration>
Alternatively, the InsertAfter instruction can be used to place the new element after the first add element with key of “ChartImageHandler”:

InsertAfter: /configuration/appSettings/add[1]

<add key="Setting3" value="Value3" />

The result will be the same.

<configuration>
  <appSettings>
    <add key="ChartImageHandler" value="storage=file;timeout=20;dir=c:\TempImageFiles\;" />
    <add key="Setting3" value="Value3" />
    <add key="Setting1" value="Value1" />
    <add key="Setting2" value="Value2" />
  </appSettings>
  ...
</configuration>

Delete

The Delete modification instruction will delete the element and any siblings. The nothing element is not incorporated in the web.config file but must be provided for the instruction to work.

For example, the configuration/appSettings element contains one add element by default:

<configuration>
  <appSettings>
    <add key="ChartImageHandler" value="storage=file;timeout=60;dir=c:\TempImageFiles\;" />
  </appSettings>
  ...
</configuration>

Use the following modification instructions:

Delete: /configuration/appSettings/add

<nothing/>

This will result in all add elements being removed.

<configuration>
  <appSettings />
... </configuration>

Editing an Element Property

Use the “SetAttribute” instruction to modify the value of an attribute.

For example, let’s have the application compile with debug mode enabled. The debug attribute of the compilation element is set to “false” by default:

<configuration>
  <system.web>
    <compilation debug="false" targetFramework="4.6">
    ...
    </compilation>
  </system.web>
</configuration>

Use the following instructions (each application will probably use different key tokens, so you will need to copy your own <assemblies> section):

SetAttribute: /configuration/system.web/compilation
debug: true

This will result in the following:

<compilation debug="true" targetFramework="4.0">
  <assemblies> … </assemblies>
</compilation>
Tuesday, November 14, 2017PrintSubscribe
Configuring SMTP Settings

In order to send emails from within your web app, the SMTP web.config settings must be configured. For example, the automatic password reminders sent by ASP.NET membership require an SMTP configuration.

Start the web app generator, and click on the project name.

Starting in release 8.0.9.0, the SMTP settings can be configured. Select “Settings”, choose “Features”, and switch to “SMTP Configuration” section to define your SMTP settings.

Select Settings, and click on Web Server Configuration option.

In the Web.Config modification instructions text box, insert your configuration. Model it after the sample displayed below:

InsertAfter: /configuration/connectionStrings
  <system.net>
    <mailSettings>
      <smtp deliveryMethod="Network" from="ben@contoso.com">
        <network
          host="localhost"
          port="25"
          defaultCredentials="true"
        />
      </smtp>
    </mailSettings>
  </system.net>

Press Finish, and regenerate the web app. The SMTP settings have been added to the web.config file and emails will now work as intended.

Learn more about configuring email settings.