Field Setup

After loading the database, the database objects (tables, views, custom views and reports) will be shown in the left pane (the database pane). Click on any database object to go to the Field Setup Page for that object at any time.

If ASP Report Maker finds any unsupported fields in a table, an [Unsupported Fields] tab will appear. You can click on the tab to view the list of fields that are not supported.

The Field Setup pages consists of two section. The upper section is a grid showing available options of all fields. The lower section contain two panels, the [View tag] panel and the [Report Field Settings] panel for the selected field.

 

The grid consists of the following sections:

 

General

Field Name Field Name (read only)
Data Type Data Type (read only)
Size Maximum field length (read only)
Expression The expression for custom field (Custom Fields only). See also Custom Fields.
Caption Caption to be displayed
Primary Key

Specify the primary key of the table. For use with showing BLOB field as image only.

Important You should use the same primary key as declared in the database, do not change it unless you are absolutely sure that the selected field(s) values are unique. Otherwise a record cannot be located properly and unexpected results may occur.

Report Page

Show Show field in report page
Width

Specify field column width

e.g. If you enter "200px" (without quotes), the output will be style="width: 200px"

Wrap Enable/Disable wrapping of field value
Sort Enable/Disable sorting for the field in the report.
Filter

Enable/Disable popup filter for the field in the report.

Normally, distinct values in the field will be populated in the popup filter. However, if the field is group-level fields, the grouping intervals will be used. If enabled, you can optionally enable "Range" for the filter. If the data type of the field is datetime, you can also optionally enable relative filters. See [Report Field Settings] below for details.

Note Always use as few filters as possible, especially for Detail and Summary Reports that have a large number of detail records. The more filters applied, the slower the page loads.
Extended Filter

Enable/Disable extended for the field in the report.

Extended Filter is a filter to be displayed at the top of the report. By default it will be displayed as a textbox for you to enter values and search. However, it can also be displayed as a combobox and has a default value. See [Report Field Settings] below for details.

Note Contrary to popup filters, performance of the report will be enhanced by the number of Extended Filters. The more Extended Filters applied, the faster the page loads. It is because the Extended Filter is done by SQL while popup filter are done by Javascript.
Filter Opr 1

First filter operator

Note Each Extended Filter can use up to 2 filter operators. However, if the first filter operator is "BETWEEN", the second operator is ignored.
Filter Opr 2 Second filter operator

Drill Down

Detail Report

If field value is displayed in a report, you can drill down by setting up a hyperlink linked to a detail report. To setup a detail report, click the "..." to open the Drill Down setup form:

Select a report as detail report, then select the parameters. Select Source Field from the current report and Target Field from the detail report. The report will then build hyperlinks for the field values to pass the selected field values from the current repor to the detail report.

To make the detail report shows meaningful details, you need to pass the required parameters from the current report to the detail report. Select the field values you need to pass, make sure they are sufficient for selecting the relevant records in the detail report. See Tutorial - Drill Down Report.

Parameter

If checked, the current report can be used a detailed report and the selected field is a parameter.

Normally you do not need to manually enable this setting, after you set up detail report using the Drill Down setup form, ASP Report Maker will enable this for the required fields in the detail report.

 

Note Custom field display order by drag-and-drop

You can change the field order defined in the database by simple drag-and-drop. Simply click the Field Name column to select the field, then drag it to where you want. ASP Report Maker will generate ASP and display records according to this order. (For Detail and Summary Report only)

 

View Tag Panel

You can click the icon on the View Tag panel toolbar to select how to display the field. After selecting the View Tag, you can further setup its properties in the View tag panel.

View As tags

There are two types of View tag, Formatted Text and Image.

Formatted Text - View Tag to display the field value as formatted text with optional hyperlink. Properties:

Style
Bold Display as Bold (enclosed with <b> </b> tags)
Italic Display as Italic (enclosed with <i> </i> tags)
Align Left/Center/Right/Justify. Align the data (enclosed with <div> </div> tags)
Format
None No formatting
Currency Display in currency format
Date/Time Display in date format
Number Display in number format
Percent Display in percent format
String Format the field value with specified ASP string function or custom function
Max Length (List page)

Truncate the field value at specified max. length and append "..." to the end.

Note This setting only applied to memo fields in list page and must be larger than 0 to take effect.
Replace CR+LF by <BR>

Replace Carriage Return + Line Feed by "<br>".

Note This setting only applied to memo fields.
Hyperlink
HREF field Display the field as hyperlink with the href attribute set to the value of this field. Can be the field itself.
Target Target attribite of the hyperlink. Possible values are: _top, _parent, _self or _blank. You can also enter your own.
Prefix

Prefix added before the HREF field value. You can select one of the follows:

- None (no prefix, relative path of URL)
- http:// (prefix http:// added, absolute path of URL)
- mailto: (prefix mailto: added, email link)
- ftp:// (prefix ftp:// added, ftp link)
- file:// (prefix file:// added, file link)
- news:// (prefix news:// added, newsgroup link)

You can also enter your own partial URL (preceding the HREF field value)

Note This setting is a string to be quoted by double quotes, if you want to use ASP variable, wrap it in <%= and %>.

For example, you can enter: (no quotes)

mypage.asp?id=

The value of the HREF field will be appended to the end of the your prefix in the outputted HTML.

If you want pass a field value, you can enter: (no quotes)

mypage.asp?myfield=<%=Server.UrlEncode(MyField.CurrentValue)%>&id=

Suffix

Suffix added after the HREF field value. You can use this setting to append additional URL parameters.

For example, you can enter: (no quotes)

&field2=<%=Server.UrlEncode(Field2.CurrentValue)%>

Since this is a suffix, you should always use & at the beginning of the string.

Custom View Tag
Custom View Tag

Display the field value in report page by custom code.

Important

  1. Custom View Tag overrides ALL above View Tag settings.
  2. Custom View Tag supports Detail and Summary Reports only and does not support grouping fields.

There are some ready-to-use Custom View Tag for you to choose:

  • Barcode (including QR code)
  • Google Map

If your data stores information for above, just click the down arrow button to open the setup form, enable one of them, then click the Settings tab to setup, then click OK to save your settings.

Notes

  1. Only one of above Custom View Tag can be selected at a time. All records will use the same Custom View Tag. For instance, you can NOT use Barcode for a record and use Google Map for next record.
  2. The above Custom View Tags are provided as examples only. The third party tools used are not developed by the author of ASP Report Maker and are not part of ASP Report Maker, NO TECHNICAL SUPPORT WILL BE PROVIDED.

You can also create your Custom View Tag, they are implemented in exactly the same way as template extension (see Customizing Template). Custom View Tags must be placed under the subfolder "customviewtags" of the installation folder. Each Custom Viiew Tag must have a XML description file so it can be loaded for selection. You can open an XML file in the "customviewtags" subfolder to see the content, which is self-explanatory. Unzip the zip file to see how it is implemented.

If you want absolute freedom, click the [...] button to enter your own code to display the your data in your own ASP, HTML and JavaScript.

Important If you choose to enter your own code, you are completely on your own to display the field value. Intermediate knowledge in ASP, HTML and JavaScript is required.

Custom View Tag is HTML, if you want to embed ASP code, use <% and %>, if you want to use JavaScript, use <script type="text/javascript"> and </script>.

Custom View Tag supports the following tags:

{{{old_tag}}}

The old (original) View Tag, that is, the original code for the field. If you need to reuse the original code without changes (e.g. you just add some additional code for the field), you can use the special tag {{{old_tag}}} in your code

Example 1

{{{old_tag}}}
...Your HTML...

Example 2

If {{{old_tag}}} is inside JsRender template, it will only be converted to a JsRender Include tag {{include tmpl=... /}} to include the template of original code.

<script class="ewJsTemplate" type="text/html">
{{{old_tag}}}
...Your HTML...
</script>

{{{value}}}

The CurrentValue of the field object. It will be converted to <%= <page>.<field>.CurrentValue %>. Note that it includes the <%= and %> tags, use it in HTML only, do not use it in ASP code.

{{{view_value}}}

The ViewValue of the field object. It will be converted to <%= <page>.<field>.ViewValue %>. Note that it includes the <%= and %> tags, use it in HTML only, do not use it in ASP code.

The above tags are just some helper tags, you can write your own Custom View Tag without using them at all.

Example 3

Output the field value conditionally:

<%
If MyTable.MyField.CurrentValue = "xxx" Then ' Assume string field
    Response.Write "something"
Else
    Response.Write "something else"
End If
%>

Example 4

Output a custom link:

<a href="mypage.asp?id=<%= Server.UrlEncode(MyTable.MyField.CurrentValue) %>">My Link</a>

 

Image - View Tag to display as Image using <img> tag. The field can be a BLOB field or a field storing the file name of the image.

View As tags

IMG Tag attributes
Width Specify the width of the image
Height Specify the height of the image
Image Resize

Specify if the image should be resized to above dimensions.

Note This option requires Image Resize extension (for registered users). Also read Third-party Tools.
File Folder

Specify the path of the image. This folder must be relative to the application root.

If not specified, the global File Folder will be used, read ASP Settings.

 

Hyperlink (same as above)

 

Field Settings Panel

Crosstab Report

Crosstab

This read-only property show the type of the field in the report, possible values are:

  • Row Heading
  • Column Heading
  • Value
  • (Not shown)

You can click the [...] button to edit the report.

Grouping Level

If the field is Row Heading in the report, this read-only property show the grouping level, possible values are 1-4.

You can click the [...] button to edit the report.

Show Summary

If the field is Row Heading in the report, this property sets if summary should be displayed at the end of each grouping level.

Summary Value

If the field is Value field in the report, this property sets the summary value, possible values are:

  • AVG
  • COUNT
  • MAX
  • MIN
  • SUM
Grouping Interval

If the field is Column Heading field in the report and is of date/time type, this property sets the interval for the field values, possible value are:

  • Year
  • Quarter
  • Month
  • Date
  • Date/Time
Year filter

If the field is Column Heading field in the report and is of date/time type, and the Grouping Interval is Quarter or Month, this setting become available. If unchecked, quarters or months of different year in the report will be displayed together. If checked, a combobox for the available years will be added automatically to the report so user can select which year's data to display.

Comma Separated Values

If the field store comma separated values (e.g. "value1,value2,value3") and you want to split them into separate values for filtering, enable this setting.

Note The values must be delimited by commas without spaces.

Detail and Summary Report

Detail/Summary

This read-only property show the type of the field in the report, possible values are:

  • Group-level
  • Value
  • (Not shown)

You can click the [...] button to edit the report.

Grouping Level

If the field is group-level field in the report, this read-only property show the grouping level, possible values are 1-4.

You can click the [...] button to edit the report.

Show Summary

If the field is group-level field in the report, this property sets if summary should be displayed at the end of each grouping level.

Grouping Interval

If the field is group-level field in the report and is of date/time type, this property sets the interval for the field values, possible value are:

  • Normal (All distinct values)
  • Quarter
  • Month
  • Week
  • Day
  • Hour
  • Minute

If the field is group-level field in the report and is of string type, this property sets the interval for the field values, possible value are:

  • Normal (All distinct values)
  • 1st Letter
  • 2 Initial Letters
  • 3 Initial Letters
  • 4 Initial Letters
  • 5 Initial Letters

If the field is group-level field in the report and is of numeric type, this property sets the interval for the field values, possible value are:

  • Normal (All distinct values)
  • 10s
  • 50s
  • 100s
  • 500s
  • 1000s
  • 5000s
  • 10000s
Summary Values

If the field is Value field in the report and is of numeric type, this property sets the summary values, possible values are:

  • Avg
  • Max
  • Min
  • Sum
  • Count

More than one summary values are allowed. Select Skip null/0 if you want to skip null and zeroes when calculating above values.

Comma Separated Values

If the field store comma separated values (e.g. "value1,value2,value3") and you want to split them into separate values for filtering, enable this setting.

Note The values must be delimited by commas without spaces.

Filters

Relative Days

Add the following options in the popup filter and Extended Filter:

  • Yesterday
  • Today
  • Tomorrow
Relative Day Periods

Add the following options in the popup filter and Extended Filter:

  • Last 30 days
  • Last 14 days
  • Last 7 days
  • Next 7 days
  • Next 14 days
  • Next 30 days
Relative Weeks

Add the following options in the popup filter and Extended Filter:

  • Last two weeks
  • Last week
  • This week
  • Next week
  • Next two weeks
Relative Months

Add the following options in the popup filter and Extended Filter:

  • Last month
  • This month
  • Next month
Relative Years

Add the following options in the popup filter and Extended Filter:

  • Last year
  • This year
  • Next year
Past / Future

Add the following options in the popup filter and Extended Filter:

  • Past
  • Future
Range

Add [From] and [To] combobox in the popup filter for user to select a range of field values to filter.

Note This option is only available for field with Filter (popup filter) enabled in above grid, NOT applicable to Extended Filter.
Default values

Default values of Filter (popup filter) without Extended Filter enabled.

Note
  1. If both Filter (popup filter) and Extended Filter are enabled, the default values for Extended Filter will be used (see below).
  2. The default values must be a valid ASP expression of array, e.g. Array("value1", "value2", "value3"). If you want to specify above special filters, use "@@FilterID". The filter ID is same the filter name with pascal case (the first letter in the identifier and the first letter of each subsequent concatenated word are capitalized) and no spaces, e.g. the ID for the Last two weeks filter is "LastTwoWeeks", then you specify it as default value by, e.g. Array("@@LastTwoWeeks").
Notes
  1. The "relative filters" (i.e. Relative Days, Relative Day Periods, Relative Weeks, Relative Months, Relative Years, Past/Future filters are only available for datetime field with Filter or Ext. Filter enabled in above grid.
  2. For Extended Filters, the "relative filters" only support fields displayed as SELECT-ONE or SELECT-MULTIPLE (see below).
  3. The "relative filters" does not support field which is set as Column Headings in Crosstab Report.
  4. The "relative filters" does not support Use dropdown or Use modal dialog (see below).

  5. If you enable a group of filters above but want to disable some of the filters under the group, you can unregister them using Page_FilterLoad server event, see the example in Server Events and Client Scripts.

 

Extended Filters

Display as

Specify how the Extended Filter is displayed, possible values are:

  • TEXT - textbox (default)
  • SELECT-ONE - combobox
  • SELECT-MULTIPLE - listbox (multiple selection)
  • CHECKBOX - checkboxes
  • RADIO - radio buttons

Normally the Extended Filter is displayed as textbox for user to input search criteria. If this setting is enabled, the Extended Filter will be displayed as combobox. Each option in the combobox will be a distinct value of the field in the database.

Note If the field not displayed as TEXT, the default filter operator will be "=", the Filter Opr 1 and Filter Opr 2, if specified, will be overridden.
Default value

Default value for the Extended Filter

If you want to auto-select an option in the Extended Filter, enter a default value. Make sure the value exists among the options or it will not be found and no option in the Extended Filter will be selected.

Note The default value will be directly assigned to a variable, please make sure that the input value is a valid ASP expression. If it is a string, it must be double-quoted. If it is a date, it must be double-quoted and in the format of default data format. If you use SELECT-MULTIPLE or CHECKBOX, the input value will be generated as array(<Default value>), so you can enter more than one value with comma as delimiter, e.g. "value1","value2".
Default value (for opr 2)

Default value for the Extended Filter with "BETWEEN" as filter operator 1 or with filter operator 2 selected. For use with extended filter displayed as TEXT (textbox) only.

Note The default value will be directly assigned to a variable, please make sure that the input value is a valid ASP expression. If it is a string, it must be double-quoted. If it is a date, it must be double-quoted and in the format of the default date format.
Size

Size attribute of the <SELECT> tag (number of visible options). For use with SELECT-ONE or SELECT-MULTIPLE (see above) only.

Size

Size attribute of the <input type="text> tag (width of an <input> element, in characters). For use with TEXT (see above) only.

Maxlength

Maxlength attribute of the <input type="text> tag (maximum number of characters allowed). For use with TEXT (see above) only.

Parent field #1

If a filter is display as TEXT with Auto-Suggest and Force Selection enabled, or as SELECT-ONE, SELECT-MULTIPLE, CHECKBOX, RADIO, the filter can have up to 4 parent filter. If a selection list has parent field(s), the parent/child fields become Dynamic Selection Lists. When the parent filters' selected value is changed, the options in the child filter will be filtered accordingly, based on the field values in the report.

Parent field #2

Parent field #2 (see Parent field #1 above)

Parent field #3

Parent field #3 (see Parent field #1 above)

Parent field #4

Parent field #4 (see Parent field #1 above)

Use dropdown

Show the options in dropdown panel with min-width and max-height settings, e.g.

RADIO

CHECKBOX

Note that if the field is displayed as RADIO and Repeat columns (see below) is 1 (single column), the options will be displayed same as SELECT-ONE with Use dropdown enabled, radio buttons will be hidden, e.g.

Similarly, if the field is displayed as CHECKBOX and Repeat columns is 1 (single column), the options will be displayed same as SELECT-MULTIPLE and Use dropdown enabled, e.g.

Dropdown min-width (px)

Minimum width for dropdown

Dropdown max-height (px)

Maximum height for dropdown

Option Template

Optional JsRender template for options.

If you have enabled Use dropdown, you can display the values in your own HTML by Option Template, e.g.

'<em><span class="text-info">{{:df1}}</span></em>'

Then the options for the field will be displayed in your HTML format.

Notes

  1. By default, only {{:lf}} (option value) and {{:df1}} (display value #1) have values and both have the same value,
  2. Option template is in the format of JsRender template, refer to JsRender API for more details. 
Auto-Suggest

For use with filter displayed as TEXT, enable this to add Auto-Suggest feature to the textbox. The dropdown list is built from distinct values of the field in the report.

The number of options in the dropdown list is 10 by default, you can adjust it by changing the Auto-Suggest maximum display entries setting under Advanced Settings.

Force Selection

For use with filter displayed as TEXT with Auto-Suggest. Forces the user to select an option from the dropdown list. If user enters other search criteria in the textbox, it will not be accepted.

Use modal dialog

For use with field displayed as TEXT/SELECT-ONE/SELECT-MULTIPLE/RADIO/CHEKCBOX. Use a modal dialog to lookup options. Supports searching, paging and option template (see above).

Note The modal dialog is same for TEXT/SELECT-ONE/SELECT-MULTIPLE/SELECT/RADIO/CHEKCBOX, the selected value is read-only except the field is displayed as TEXT with Auto-Suggest enabled.
Modal dialog page size

For use with Use modal dialog. Specifies the number of records per page in the dialog. If not specified, default is 10.

Filter

Additional filter to be added to the WHERE clause for getting the options from database.

Note The setting must be a valid ASP expression. If it is a string, it must be double quoted.
Order

Sorting order of the options in the filter. Either ASC (ascending) or DESC (descending).

Repeat columns For use use RADIO or CHECKBOX only. Specifies the no. of radio buttons of checkboxes per row.
Date Interval

Display the Extended Filter as combobox of date interval (for date fields only)

If the field is date field, other than Display as, you can also further choose to use date interval. If this setting is enabled, Display as is overridden. The Extended Filter will be displayed as combobox with date intervals instead of distinct values. For example, if you select "Year", the combobox will only contain options of years, not options of distinct dates.

Possible date intervals are:

  • Year
  • Quarter
  • Month
  • Day
Default Year

Default year for the Date Interval combobox. Enter full year (yyyy), e.g. 2008.

Note This setting can also be a valid ASP expression (e.g. a function) which returns the year, e.g. Year(Date)
Default Quarter

Default quarter for the Date Interval combobox. Possible values are 1-4.

Note This setting can also be a valid ASP expression (e.g. a function) which returns the quarter, e.g. ewr_CurrentQuarter()
Default Month

Default month for the Date Interval combobox. Possible values are 1-12.

Note This setting can also be a valid ASP expression (e.g. a function) which returns the month, e.g. Month(Date)
Default Day

Default day for the Date Interval combobox. Possible values are 1-31.

Note This setting can also be a valid ASP expression (e.g. a function) which returns the day, e.g. Day(Date)
Validate

Supported validation formats are:

  • Integer
  • Float
  • Range
  • Date
  • Time
  • Email
  • Credit card
  • GUID
  • US phone number
  • US zip code
  • US social security number
  • Regular Expression
Note
  1. If Regular Expression, client side and server side arguments must be entered, depend on if you have enabled client-side and server-side validation (see ASP Settings), see Arguments (Client-side) and Arguments (Server-side) below.

  2. You can add your own functions for validation. The function must accept at least one argument (the value) and return true (valid value) or false (invalid value). If your functions requires additional arguments, see Arguments (Client-side) and Arguments (Server-side) below. You can add your function names (comma separated) in the Advanced Setting CustomValidationFunctions. (See Tools.) Note that since it is both JavaScript and ASP function name, it must be a string that corresponds to a valid identifier for both sides. For example, you can enter "myValidateFunction1,myValidateFunction2" (no quotes). If you have enabled client side validation, you need to provide your JavaScript function. If you have enabled server-side validation, you need to provide your ASP function. You can put your functions in the Global Code section for server and client scripts respectively (see Server Events and Client Scripts) so they are available for use in the generated scripts.
Arguments (Client-side)

Arguments for the JavaScript functions for validation. For Regular Expression and custom validation functions only.

Note This is JavaScript arguments, it should be comma separated (if more than one) JavaScript expressions. e.g. If it is a string, it must be single or double quoted.

If Regular Expression, arguments must be in the format of "pattern"[, "flags"]

pattern
Required. The regular expression pattern to use. Enclose the pattern in quotation marks.
flags
Optional. Enclose flag in quotation marks. Available flags are:
  • g (global search for all occurrences of pattern)
  • i (ignore case)
  • gi (both)
Arguments (Server-side)

Arguments for the ASP functions for validation. For Regular Expression and custom validation functions only.

Note This is ASP arguments, it should be comma separated (if more than one) ASP expressions. e.g. If it is a string, it must be double quoted.

If Regular Expression, arguments must be the pattern to search for, as a string.

Use date/time picker

Check this option to use a visual date/time picker instead of manual input.

Note
  1. This option is only available for the date validation formats with or without time: Date and Time
  2. The popup calendar and time picker are not developed by the author of ASP Report Maker and no technical support will be provided. (See Third-party Tools.)
Error Message

Enter the error message to popup if error occurs.

Note If you use Multi-Language (see ASP Settings), use Multi-Language Property Editor, see Tools for details.
Client side events

You can manipulate fields in the Extended Filters panel on the client side quickly with "fields" jQuery plugin (see Server Events and Client Scripts).

Example 1

Set field values based on current field value

{ // keys = event types, values = handler functions
    "change": function(e) {
        if (this.value == "xxx") {
            $(this).fields("FieldA").value("yyy"); // Set value to FieldA
            //$(this).fields("FieldA").visible(false); // true to show, false to hide
            //$(this).fields("FieldA").readonly(true); // true as readonly, false as normal (for Text and TextArea only)
            //$(this).fields("FieldA").disabled(true); // true as disabled, false as normal

        } else {
            $(this).fields("FieldB").value("zzz"); // Set value to FieldB
        }
    }
}

Example 2

Client side calculation based on user input

{ // keys = event types, values = handler functions
    "change keyup": function(e) {
        var $row = $(this).fields(); // Get an object of all fields, each property is a jQuery object of the input element(s) of a field
        var st = $row["UnitPrice"].toNumber() * $row["Quantity"].toNumber() * (1 - $row["Discount"].toNumber()); // Convert to number and calculate
        $row["SubTotal"].value(st); // Set result to a field
    }
}

Note All client side events are generated in the script ewrusrevt<version>.js, after changing client side events, remember to re-generate the .js file.
Custom Edit Tag

Display the field value in Extended Filter by custom code.

Important

  1. Custom Edit Tag overrides ALL above Edit Tag settings.
  2. Custom Edit Tag is only a provision for your own code or your own implementation of third party tools. If you choose to enter your own code, you are completely on your own to edit the field value. Intermediate knowledge in ASP, HTML, CSS and JavaScript is required. NO TECHNICAL SUPPORT WILL BE PROVIDED for any third-party tools.
  3. Only one Custom Edit Tag can be selected at a time. All records will use the same Custom Edit Tag. You cannot use a Custom Edit Tag for a record and use another Custom Edit Tag for next record.
  4. The sample Custom Edit Tag is provided as examples only. The third party tools used is not developed by the author of ASP Report Maker and is not part of ASP Report Maker, NO TECHNICAL SUPPORT WILL BE PROVIDED.

To use Custom Edit Tag, click the down arrow button to open the setup form, enable one of them, read the notes at the bottom panel carefully, then click the Settings tab to setup, and click OK to save your settings.

You can create your own Custom Edit Tag, they are implemented in exactly the same way as template extensions (see Customizing Template). Custom Edit Tags must be placed under the subfolder "customedittags" of the installation folder. Each Custom View Tag is basically a XML description file. You can open the sample Custom Edit Tag's XML file in the "customedittags" subfolder to see the content, which is self-explanatory.

Example

<?xml version="1.0" encoding="iso-8859-1" %>
<ew-extension id="colorpicker" name="Colorpicker" version="1.0.0" type="Custom Edit Tag" author="e.World">
<description>
<![CDATA[

COMMENTS

]]>
</description>
<file>colorpicker.zip</file>
<script>bower_components/bootstrap-colorpicker/dist/js/bootstrap-colorpicker.min.js</script>
<stylesheet>bower_components/bootstrap-colorpicker/dist/css/bootstrap-colorpicker.min.css</stylesheet>
<Code><![CDATA[
{{{old_tag}}}
<script type="text/javascript">
$("#{{{id}}}").colorpicker({ format: "hex" });
</script>
]]></Code>
</ew-extension>

id Unique ID of the Custom Edit Tag. Should contains alphanumeric characters only, e.g. "colorpicker".
file

(Optional) External files required by the Custom Edit Tag (zip file). If the files are always available in the website (e.g. your Custom Edit Tag only uses JavaScript from CDN), you do not need this setting.

The zip file must be placed in the same folder of the XML file, i.e. the "customedittags" folder. In the zip file, there must be a Control File (control.xml) specifying where these external files to be copied to.

Example

<control id="colorpicker" type="copy" action="add" remark="Copy Colorpicker plugin" ofolder="bower_components" ifolder="bower_components" />

This tells ASP Report Maker to perform an additional task of copying the input folder "bower_components" (in the zip file) to the output folder "bower_components" (same name in this case) under the destination folder of the project.

script

(Optional) JavaScript required by the Custom Edit Tag.

Note If more than one scripts, delimit them by | (vertical bar), NOT line breaks, e.g. <script>//host/path/xxx.js|//host2/path2/yyy.js</script>

The path(s) can be absolute URL, relative URL or absolute physical path, read Scripts and Stylesheets for details.

stylesheet

(Optional) CSS stylesheets required by Custom Edit Tag.

Note If more than one scripts, delimit them by | (vertical bar), NOT line breaks, e.g. <stylesheet>//host/path/xxx.css|//host2/path2/yyy.css</stylesheet>

The path(s) can be absolute URL, relative URL or absolute physical path, read Scripts and Stylesheets for details.

Code

The custom code of the Custom Edit Tag.

Custom Edit Tag is HTML and ASP, if you want to embed ASP code, use <% and %>, if you want to use JavaScript, use <script type="text/javascript"> and </script>.

Notes

  1. Make sure your code is inside <![CDATA[...]]>.
  2. DO NOT use $this in your ASP code. There is no $this in the context, you can use CurrentPage() to get the current page object.
The following special tags are supported:
{{{old_tag}}}

The old (original) Edit Tag, that is, the original code for the field. If you reuse the original code without changes (e.g. you just add some additional code for the field), you can use the special tag {{{old_tag}}} in your code

Example 1

{{{old_tag}}}
<script type="text/javascript">
$("#{{{id}}}").colorpicker({ format: "hex" });
</script>

Example 2

If {{{old_tag}}} is inside JsRender template (<script class="ewJsTemplate" type="text/html">...</script>), it will only be converted to a JsRender Include tag {{include tmpl=... /}} to include the template of original code.

<script class="ewJsTemplate" type="text/html">
{{{old_tag}}}
<script type="text/javascript">
$("#{{{id}}}").colorpicker({ format: "hex" });
</script>
</script>

{{{id}}} or {{{name}}}

The id or name attribute of the HTML element of the field.

Example

$("#{{{id}}}").colorpicker({ format: "hex" });

Note {{{id}}} will not change for each <input> tag for RADIO/CHECKBOX, always use name="{{{name}}}" for RADIO/CHECKBOX.
{{{value}}}

The CurrentValue of the field object. It will be converted to <%= <page>.<field>.CurrentValue %>. Note that it includes the <%= and %> tags, use it in HTML only, do not use it in ASP code.

{{{search_value}}}

The SearchValue of the field object. It will be converted to <%= <page>.<field>.SearchValue %>. Note that it includes the <%= and %> tags, use it in HTML only, do not use it in ASP code.

Example

<input id="{{{id}}}" name="{{{name}}}}" value="{{{search_value}}}" class="form-control" ... />

{{{search_value_2}}}

The SearchValue2 of the field object. It will be converted to <%= <page>.<field>.SearchValue2 %>. Note that it includes the <%= and %> tags, use it in HTML only, do not use it in ASP code.

{{{view_value}}}

The ViewValue of the field object. It will be converted to <%= <page>.<field>.ViewValue %>. Note that it includes the <%= and %> tags, use it in HTML only, do not use it in ASP code.

{{{tag_id}}}

The id of the JsRender Template containing the original Edit Tag. If your Custom Edit Tag is also a JsRender Template, you can reuse it by including the template.

Example

<script class="ewJsTemplate" type="text/html">
{{include tmpl="#{{{tag_id}}}"/}}
<script type="text/javascript">
$("#{{{id}}}").colorpicker({ format: "hex" });
</script>
</script>

If you want absolute freedom, click the [...] button to enter your own code to display the your data in your own ASP, HTML, CSS and JavaScript. You can enter JavaScript and stylesheet paths in the JavaScripts(Global) and Stylesheets(Global) respectively. One line for each path. Note that the paths are global for the whole project, not just for a field, you'll see JavaScript and stylesheet paths required by other fields. A JavaScript or stylesheet may depend on other, you can move them up or down to make sure the sequences are correct.

Note If the JavaScript(s) and/or stylesheet(s) are not provided by the Custom Edit Tag itself, make sure the paths are correct and the scripts/stylesheets already exist on the server.

 

 
Ajax by Server Events and Client Scripts

Sometimes you may want to access the lookup table by Ajax yourself. For example, after the user entering a value for a field, you may want to auto-fill another field in your own way, then you can use Server Events and Client Scripts to do it. Say, if you want to fill the product price when you select a product number (using products table as lookup table) when inserting a new record, you can auto-fill the product price field either asynchronously or synchronously with your code.

Example 1: Auto-Fill synchronously

Write a Startup Script to attach onchange event: (JavaScript)

$("#sv_ProductID").change(function() {
    var result = ewr_Ajax("<%= ewr_Encrypt("SELECT UnitPrice FROM products WHERE ProductID = {query_value}") %>", $(this).val());
// Send the encrypted SQL and client side input value to server side by Ajax for execution and get the result
    $("#sv_UnitPrice").val(result);
// Set the result (manipulate it first if necessary) to the target field
});

Note The function ewr_Ajax() reuses the generated script for Ajax (rajax*.asp) so there is no need to write server side handler. For synchronous requests, if the result is a recordset, it is in the format of array of object. If the result is a row, it is in the format of object. If the result is a single value, it is in the format of string, remember to convert it to the proper data type before manipulation. The function also supports asynchronous request, just pass a callback function as the third argument, but the result from the server side is not processed and therefore is always in the format of array of object. See the source code of ewr_Ajax() in the generated ewr*.js for details.
Example 2: Auto-Fill asynchronously

Write a Startup Script to attach onchange event: (JavaScript)

$("#sv_ProductID").change(function() {
    $.post(ewr_CurrentPage(), { "myajax": 1, "token": EWR_TOKEN, "value": $(this).val() }, function(result) {
// Post back your custom data (with the synchronizer token)
        $("#sv_UnitPrice").val(result); // Set the result (manipulate it first if necessary) to the target field
    });
});

Write a server side handler, check your custom data "myajax" in Page_Load server event and return the required value. In this example, only a single value is required so ewr_ExecuteScalar() (see Server Events and Client Scripts) is used, e.g. (ASP)

If Request.Form("myajax") = 1 AND Request.Form("value") <> "" Then ' Check if it is your custom Ajax and if the query value is present
    Response.Write ewr_ExecuteScalar("SELECT UnitPrice FROM products WHERE ProductID = " & Request.Form("value"))
' Get the desired value (assume ProductID is integer so no need to quote the value)
    Call Page_Terminate("") ' Terminate the page
    Response.End
End If

If you want to return a whole row (as JavaScript object) so you can fill multiple fields, you may want to use ewr_ExecuteRow() (see Server Events and Client Scripts) to get the row and use ToJson() method of the return value before returning it so that you do not need to convert the data before using it in your callback function on the client side, e.g.

Dim row
row = ewr_ExecuteRow("SELECT * FROM products WHERE ProductID = " & Request.Form("value"))
' Get the desired value (assume ProductID is integer so no need to quote the value)

Call ResponseJson
Response.Write ewr_JsonEncode(row)
' Return the row (manipulate it first if necessary)

 

 

 ©2006-2018 e.World Technology Ltd. All rights reserved.