Smartstaff, administrator
3,315
edits
Changes
→Access, Display and Format options for Data
==What is the "Special - XML" Custom field and why would I use it?=General Description=[[File:xml-samplexmlSample.png|The look of an XMLthumb|none|500px|Example field configured as a budget sheet.]]
{{Show Up/Down Button}}
{{Show Clear Button}} {{Custom Field Ids}} =Configuration - Essentials===Creating the field==Typically XML Advanced Data table custom fields are created for UTA level 1, 2 or 3, (example: e.g. a grant application) or they are created for organizations. To create a XML custom the field: #Navigate to the desired place, settings area where you want to create the XML custom field a worksheet (example e.g. the UTA level 1).
# Click the '''New Field''' (+) button.
# For Field Type select '''Special - XML Advanced DataTable'''.# Enter a '''Field Name''', '''Caption''' then '''Save'''.# Use the '''Section Builder''' button to begin process of creating the XML tables.# Use the '''Custom Field''' button to navigate back from the Section Builder to the Field settings to configure the display of tables. ==Create a Simple Table==Using the '''Section Builder''' you can create sections and define the attributes of each section and the cells within them. You can define the number of rows and columns, the display format, calculation formulas, and modify other parameters. [[File:xml-sectionbuilder1.png|thumb|none|500px|The section builder.]] # While editing the custom field click on the '''Section Builder''' button (the four square icon) in the action bar.# Create a '''New''' section and enter a '''Section Name''' (e.g. Expenses).# Enter '''Number of Rows''' and '''CaptionNumber of Columns'''desired.# Click Once you '''Save'''you will be brought to the '''Cell Details''' tab.# Define a '''Display Name''' for the column headers (e.g. Item, Amount, Date).# Define a '''Display Name''' for the first column of each row (e.g. Salaries, Equipment, Other).# Within each of the column headers you can define a '''Format''' for the column (e.g. Text, Currency, Date). For the Number format option you may also specify a precision.# When you are done click the '''Build button'''. Note: # When you choose the format '''Currency''' in a column header, make sure you specify the column alignment as '''Right Align'''. This way it will be easy for the user to compare the values. This step is also required if you plan to export this data to PDF for printing.# You must use unique node names of sections, rows, and columns within this field.
=== Using XMLs Section Builder to create static XML =Create a Table with a Dynamic Number of Rows==[[File:xml-sectionbuilderxmlDynamic.png|The section builderthumb|none|500px|Example section set to dynamic rows.]]
* '''Maximum Number of Rows''': Set a maximum limit to the number of rows that can be entered, or leave as 0 for no limit.
* '''Maximum Message''': The message to be displayed when the maximum limit is set and reached by a user. A default message is displayed if this input is empty.
==Configure the Display of Tables==
The presentation of the XML Data custom field is configured in the '''General Settings''' tab of the field. This is defined in the XSL Template (Extensible Style Sheet Language) inputn. The XSL Template includes a sample template link. Once you have inserted sample template you will need to specify which sections should appear and where they should appear.
[[File:xml-xsl.png|thumb|none|500px|The XSL stands for Extensible Style Sheet Language; the XSL template defines how the XML will look. To make this easy we have included a sample template. All you have to do is add the template and specify where you want each section to appear. This is done on the field and not in the section builderconfiguration.]]
# While editing the custom field locate the '''XSL Template''' link and insert the '''Sample Template'''.
# Locate the marker below.
Note:
@section.''SectionNodeName''@
In the section builder you declare the formatting such as currency or numeric for specific columns as well as choose the precision.
You can also do calculations on numeric and currency data (e.g. to sum the contents of column one, over two rows, enter '''=[1,1]+[2,1]''').
# Click the desired '''Cell'''.
# In Enter the '''Cell Properties''' enter your desired formula into the '''Content''' input.
# Click '''Build'''.
The Syntax for basic calculations within a section:
{| borderclass="1wikitable"|-||'''Operation'''||'''Symbol'''||'''Example'''
|-
|| Add|| +|| =[row#,column#]+[row#,column#]
|-
|| Subtract|| -|| =[row#,column#]-[row#,column#]
|-
|| Divide|| /|| =[row#,column#]/[row#,column#]
|-
|| Multiply|| *|| =[row#,column#]*[row#,column#]
|}
So if you wanted to add the values of row 1 and 2 together in column 1 you would enter '''=[1,1]+[2,1]'''.
Refer to cells in different sections using this syntax
'''[@section.''sectionnodenamesectionname''.id@_''rownodename''_''columnnodename'']'''
'''@xml.customfieldname.sectionnodename.rownodename.columnnodename@'''
==Validate values when saving the worksheet==
Clicking on a cell inside the section builder will present you with the cell properties. There are two cell properties used for the validation of cells when the xml worksheet is saved.
* '''Validation Script''': Validates the input field.
* '''Validation Message''': Content that is displayed, when the validation script is not true (e.g. Value must be greater than 100).
Examples
<pre>ssParseNum([this])>0</pre>ExamplesMessage:Total must be greater than $0.00
* Date is at least 30 days in the future
<pre>datediff(ConvertDateStr([this],'@dateformat@'),'@date(currentdate)@','d') > 30</pre>
Message: Please select a date that is at least thirty 30 days from today.
* Cell is not empty
<pre>[this].length>0</pre>
Message: Please provide a value.
* Check the user selected something other than the default Combo Box value
<pre>[this]!="Default Combo Box Value"</pre>
Message: Please select a value.
Note, '''Default Combo Box Value''' should be substituted with the default value you have configured, e.g. '''--- Select One ---'''.
* Integer greater than 0 (Allow only an integer or if your field on the XML is formatted to display/use a comma.)
<pre>parseInt([this])>0</pre>
Message: Please provide a numeric value greater than 0.
===SmartCheck Validation===Use SmartCheck for validation when possible. SmartCheck validation is a secure server-side method. SmartCheck also displays all error messages in a context as well as in one central place. Validate a table node is not empty and display a message. <pre>if("<ssEscape>@level1.xml.fieldname.sectionnodename.rownodename.columnnodename.nodevalue@</ssEscape>"=="")
{result.isPassed=false;
result.addMsg('xml_@fieldname.id@','YourAlertMessage'); }</pre>
===Submit Logic Validation===Use Submit Logic in conjunction with Submit Buttons to Validate a XML worksheet.
Check an XML a node in not blank when saving the XML worksheet.<pre>"<ssEscape>@level1.xml.fieldname.sectionnodename.rownodename.columnnodename.nodevalue@</ssEscape>"!=""</pre>
<pre>"@level1.xml.fieldname.sectionnodename.rownodename.columnnodename.nodevalue@"!==== Special - Browser Script validation ====""</pre>
===Special - Browser Script validation===
You can enter JavaScript and jQuery into XML JavaScript Function input to create specific validations. Use the following syntax when referencing a value in your variables.
<pre>@xml.customfieldname.sectionnodename.rownodename.columnnodename@</pre>
The following function allows you to check for an already selected value from an existing row when using dynamic rows:
<pre>// REPLACE '7172_dsItem_Population' AND '7172_dsItem_Population_' WITH SPECIFIC XML FIELD ID
var saveFunc=saveXML;
saveXML=function() {
checkdupeval();
}
function checkdupeval() {
var result = 0;
var numOfRows = document.getElementsByName('7172_dsItem_Population'); //section node
var ctr=1;
for (ctr=1;ctr<numOfRows.length;ctr++)
{
var field1='7172_dsItem_Population_'+ctr;
var lastfield='7172_dsItem_Population_'+numOfRows.length;
var a = document.getElementById(field1).value;
var b = document.getElementById(lastfield).value;
if( a == b)
{
alert ("Please list each population no more than once.");
result = 1;
}
}
if(result==0)
saveFunc();
}
</pre>
The following function allows you to check for an already selected value from an existing row when using dynamic rows on multiple sections:
<pre>
var saveFunc=saveXML;
saveXML=function() {
if (checkdupeval_Section1() == 0 && checkdupeval_Section2() == 0 && checkdupeval_Section3() == 0) {
saveFunc();
}
}
function checkdupeval_Section1() {
var result = 0;
var numOfRows = document.getElementsByName('16580_row_COUNTY'); // REPLACE '16580_row_COUNTY' AND '16580_row_COUNTY_' WITH SPECIFIC XML sectionid_rownodename_columnnodename for Section 1
var ctr=1;
for (ctr=1;ctr<numOfRows.length;ctr++)
{
var field1='16580_row_COUNTY_'+ctr;
var lastfield='16580_row_COUNTY_'+numOfRows.length;
var a = document.getElementById(field1).value;
var b = document.getElementById(lastfield).value;
if( a == b)
{
alert ("Please list each option no more than once for Section 1.");
result = 1;
}
}
return result;
}
function checkdupeval_Section2() {
var result = 0;
var numOfRows = document.getElementsByName('16581_row_COUNTY'); // REPLACE '16581_row_COUNTY' AND '16581_row_COUNTY_' WITH SPECIFIC XML sectionid_rownodename_columnnodename for Section 2
var ctr=1;
for (ctr=1;ctr<numOfRows.length;ctr++)
{
var field1='16581_row_COUNTY_'+ctr;
var lastfield='16581_row_COUNTY_'+numOfRows.length;
var a = document.getElementById(field1).value;
var b = document.getElementById(lastfield).value;
if( a == b)
{
alert ("Please list each option no more than once for Section 2.");
result = 1;
}
}
return result;
}
function checkdupeval_Section3() {
var result = 0;
var numOfRows = document.getElementsByName('16582_row_COUNTY'); // REPLACE '16582_row_COUNTY' AND '16582_row_COUNTY_' WITH SPECIFIC XML sectionid_rownodename_columnnodename for Section 3
var ctr=1;
for (ctr=1;ctr<numOfRows.length;ctr++)
{
var field1='16582_row_COUNTY_'+ctr;
var lastfield='16582_row_COUNTY_'+numOfRows.length;
var a = document.getElementById(field1).value;
var b = document.getElementById(lastfield).value;
if( a == b)
{
alert ("Please list each option no more than once for Section 3.");
result = 1;
}
}
return result;
}
</pre>
==Managing Level 2 / 3 Activities with a Section==
System administrators can configure this field to add, modify or delete {{l2}} records on a {{l1}} entity or {{l3}} records on a {{l2}} entity.
In the '''Section Builder''', when the ''Number of Rows'' for a Section is set to '0', the ''Enable Mapping'' option will be shown.
[[Image:XMLEnableMapping2017.png|link=|800px|border]]
When '''Enable Mapping''' is selected, you can choose one type of activities to be referenced by this field.
The '''Activity Status Filter''' setting allows you to filter the activities to be referenced by status.
The '''Additional Filter''' setting allows you to select custom fields and associated values. These are used to filter the existing activities that will be listed within this field. The custom fields used have to be fields with pre-defined options (e.g. [[Custom_Field_Type:_Select_One_-_Dropdown_List|Select One - Dropdown List]], and [[Custom_Field_Type:_Select_Many_–_Check_Boxes|Select Many – Check Boxes]]).
[[Image:XMLEnableMappingFilter2017.png|link=|650px|border]]
When building your section, you will need to map the fields on the {{l2}}s that will be referenced by the section.
For each Section column, enter the field name from the Level 2 type that you have selected from the '''Activity Type''' dropdown in the '''Map Field''' section:
[[Image:MappingL2Fields2017.png|link=|800px|border]]
The syntax for the '''Map Field''' section is:
* for [[custom fields]], the field name (i.e., '''Fund Name''');
* for [[Standard_Field|Standard Field]]s, use the prefix '''sf_''' and then the system name for the standard field (i.e., '''sf_status''').
see [[Standard Level 2 Field List]] article for a list of system names for {{l2}} standard fields.
If the Standard or Custom field has a limited number of pre-defined options then these need to be defined in the Content section of the cell properties.
You may need to reference some standard field options using both the displayed name and stored ID values.
[[Image:MappingL2Fields2018.png|link=|650px|border]]
When this section is added to the Template of your field, the list of {{l2}} activities will be displayed when the worksheet is opened. Level 2s can be added, deleted and modified directly from the {{l1}} Advanced Data Table field.
=Displaying XML Data=
==Displaying Advanced Data Table data on an object==
[[File:xml-readonly.png|500px|border|The XML displayed in a read only]]
The Advanced Data Table custom field can open in a new or modal window. The '''Open in Modal Window''' option is recommended. You can toggle this on under '''Document Options'''.
Use the '''Display - Text and Variables''' custom field to display the content of the Advanced Data Table on the object. The same syntax can be used elsewhere in the system when referencing this field's values.
# Go to the desired location where you want to create the custom field.
# Click the '''New Field''' (+) button in the action bar.
# For '''Field Type''' select '''Read Only – System Display - Text and Variables'''.
# Enter a '''Field Name'''.
# For '''Variables''' enter '''@xml.''CustomFieldName''.''SectionNodeName''.html@''' (replace the '''CustomFieldName ''' and '''SectionNodeName ''' with the actual names from your XMLexample '''@xml.Budget.Expenses.html@''').
# Scroll Down to the '''Display''' section.
# For '''Caption''' select '''Hide Caption''' (we recommended that you hide the caption for the display so that you can utilize the full screen width).
# Click '''Save'''.
# Navigate back to the XML custom Advanced Data Table field and click '''Save''' (notice '''Display Fields Refreshed Upon Edit''' will be updated with this updates the linkage and ensures when data is entered into the custom field ID of worksheet the Read Only we just created. From now data displayed on when a user edits the XML the read only object will be also get automatically updated. If you miss this step it , information entered into the Advanced Data Table will only refresh in the Display - Text and Variables field when the object is saved).
Note: you may want to create two '''Display - Text and Variables''' custom fields for each '''Advanced Data Table''' custom field. One that you will use for printing and one for displaying on the object.
* Extract the value from a specific individual cell using the '''field name'''.
<pre>@xml.fieldname.sectionnodename.rownodename.columnnodename@</pre>
* Extract the value from a specific individual cell using the '''field id'''.
<pre>@xml.#fieldid#.sectionnodename.rownodename.columnnodename@</pre>
* Extract numeric value and return in '''comma format''' (i.e. 1000 will display as 1,000).
<pre>@xml.fieldname.sectionnodename.rownodename[# ~comma(columnnodename.nodevalue)~ #]@</pre>
* Extract a numeric value and return in '''currency format'''.
<pre>@xml.fieldname.sectionnodename.rownodename[# ~currency(columnodename.nodevalue)~ #]@</pre>
* Extract a numeric value and return in a '''specific currency format'''.
<pre>@xml.fieldname.sectionnodename.rownodename[# ~currency_eur(columnodename.nodevalue)~ #]@</pre>
Further currency formatting options below
{| border="1"
|-
|| usd|| $300.00
|-
|| eur|| €300.00
|-
|| jpy|| ¥ 300
|-
|| zar|| R 300.00
|-
|| inr|| ₹300.00
|-
|| frca|| 300,00 $
|}
* Extract a numeric value and return in '''currency format with two decimal places'''. If pulled from a '''dynamic''' XML section then you will see multiple values.<pre>@xml.fieldname.sectionnodename.rownodename[# ~currency_eur(columnodename.nodevalue,2)~ #]@</pre>Extract a numeric value and return in '''currency format with two decimal places''' for value pulled from a '''static''' XML section.<pre><!--@sscalculation(format("@xml.fieldname.sectionnodename.rownodename.columnodename.nodevalue@",2))--></pre>Extract date values and return with specific formatting using the following syntaxReturn the date in the user's date format.<pre>@xml.fieldname.sectionnodename.rownodename.formatdate(columnnodename.nodevalue)@</pre>Return the year.<pre>@xml.fieldname.sectionnodename.year(columnnodename.nodevalue)@</pre>Return the month.<pre>@xml.fieldname.sectionnodename.month(columnnodename.nodevalue)@</pre>Return the month name.<pre>@xml.fieldname.sectionnodename.monthname(columnnodename.nodevalue)@</pre>Return the day.<pre>@xml.fieldname.sectionnodename.day(columnnodename.nodevalue)@</pre>Return the day of the week.<pre>@xml.fieldname.sectionnodename.dayweek(columnnodename.nodevalue)@</pre>Count the number of rows the user created in a dynamic XML section.<pre>@xml.fieldname.sectionnodename.rownodename.nodecount@</pre>Return the XML feed (code) from the field.<pre>@fieldname.xmlvalue@</pre>Return multiple rows for XML with dynamic sections.<pre>@xml.fieldname.sectionnodename.rownodename[# ~columnnodename.nodevalue~ #]@</pre>Return Filtered row values for XML with dynamic sections.<pre>@xml.fieldname.sectionodename.rownodename[#(?criteria="~colunnnodename.nodevalue~" == "matching criteria")~columnnodename.nodevalue~ #]@</pre>
<pre>@xml.xml3col fieldname.xmlCellsectionnodename.note {width:150px; min-width:150px; max-width:150px; font-size:12px}month(columnnodename.nodevalue)@</pre>
To ensure data entered into an '''Advanced Data Table''' fits on screen and will converted to a PDF without having data cut off, administrators need to upload two external CSS style sheet to a SmartFolder, reference it on the '''Advanced Data Table''' and the '''Display Text and Variables''' fields as well as add some code to both of these fields.
# Make sure your Advanced Data Table has 8 or less columns to ensure it will print and fit on screen.# If the user is expected to enter paragraphs of information, do so in a new row or new section, instead of adding another column.# If your worksheet does not look as expected make sure '''Display OrderApply Default Styles''': Used to define where this field appears relative to other fields. Lower numbers appear closer to is toggled on in the top '''Section Builder''' and then click '''Build''' on each of your sections in the pagesection builder.
===Styling the Advanced Data Table for viewing onscreen===Ensure the columns and rows of your '''CaptionAdvanced Data Table''': Used as look good onscreen, when a label or question before the field. If left blankuser enters information, by following the Field Name will be displayed as the captionsteps below.
====Uploading the external CSS files and getting the relative links====# Download the CSS files [[File:CSS.zip|CSS.zip]]# In your desired instance navigate to the Menu Icon and choose '''Caption LocationSmartFolders'''# If it does not exist already create a '''New Folder''' and call it '''System Files'''# Upload the CSS files found inside the Zip file you downloaded in step 1# Inside SmartFolders in the column called '''File Options''' for the desired file select '''View URL''' from the drop down. This will give you the absolute path to the file you uploaded# Copy this link that starts with '''https: Used ''' and ends with '''/CSS_for_XSL_onscreen_1290.css'''.# Remove the first part of the link before the '''/files...''' to make it a relative link. Absolute links can have an adverse affect on your instance and they won't work as expected on your backup. So Always convert the absolute link to a relative link. Your relative link will look like '''/files/000000/f000000/CSS_for_XSL_onscreen_1290.css'''# Save this relative link in a text file so we can add it to each '''Advanced Data Table''' custom field in your instance.# Repeat steps 5 to control 8 for the position second CSS file which will be used for rendering on the object and visibility of in the captionPDF. See examples [[Label_Display_Options]]
====Modifying the Advanced Data Table template====# Download the templates used for the '''InstructionsAdvanced Data Table'''and the '''Display Text and Variables''' fields [[File: Used TEMPLATES.zip]].# In the desired '''Advanced Data Table''' Field paste the content from the xsl_template_1290 file you downloaded, into the XSL Template input.# Change the href in the link to the relative URL that points to the CSS file you previously uploaded to display the SmartFolder (Example href="/files/000000/f000000/CSS_for_XSL_onscreen_1290").# Update the text called '''Title''' in two places inside the XSL template.# Update '''@section.Section Node Name@''' with the '''Section Node Name''' you want to display.# Modify the caption areaclass wrapper with the amount of columns in your section. Example '''class="xml6col"''' is for a 6 column section. If you have 2 columns, change it to '''class="xml2col"'''. Instructions appear below # Save the caption and are always visible unlike tool tips that appear on mouse overAdvanced Data table Field.
# Under Display you can customize the Button Label. To meet with Accessibility guidelines you must change the button label from '''Open''' to something meaningful like '''Modify Budget'''. The user must know what the button will do based on the text in the button. You cannot have a generic link that says '''open''' or '''click here''' as that does not provide enough information when read out of context by a screen reader.
# Sections must contain 8 or less columns to render properly and be usable.
==== Options =Styling Advanced Data Table for Converting to PDF and Printing===You can print your Advanced Data Table content by displaying it in a '''Display Text and Variables''' custom field. In order to do this the content must fit within 700 pixels wide (portrait) or 900 pixels wide (landscape) otherwise content will cut off when a PDF is generated. To ensure content does not cut off and to ensure columns between sections align, we will use CSS in a SmartFolder and amend our '''Display Text and Variables''' custom field.
# Navigate to the desired '''Display Text and Variables'''.
# Paste the contents of '''display.html''' into the '''Content''' section of the field.
# update the href to point to the relative path to the file called '''xml-print.css''' that you uploaded to the SmartFolders.
# Add your desired variable example '''@xml.Budget.Expenses.html@''' inside the div with the '''class="xml8col"'''.
# Change the '''8''' in '''class="xml8col"''' to the number of columns in your section. Note you must have 8 or less columns.
# If you want this table to be displayed wider for landscape printing add the word '''landscape''' in the class example '''class="xml8col landscape"'''.
# Save your custom field
If you created two '''Track ChangesDisplay - Text and Variables''': Used to log changes custom fields one for printing and one for onscreen. The above instructions are for the print version as it will reduce the font size and constrain the content to 700 pixels. In this print version use the setting '''SmartFields View''' and choose '''Include'''. This will include this field example: who updated in the field when PDF. On the second '''Display - Text and Variables''' intended for on screen use '''SmartFields View''' and what was choose '''Exclude'''. This will hide the new and old valuesonscreen version from the PDF. Lastly for the onscreen version you do not use the xml-print.css or the div wrappers.
<pre>ExtractValue([this], '/worksheet/sectionnodename/rownodename/columnnodename')</pre>
{{CustomFieldPageFooter}}
[[Category:XML]]
