Table of Contents
Field Types
These are the currently supported Field types that can be applied to cells.
Simple Fields
- text - This type will display a simple text box.
- password - This type will display a password entry box. Data entered will not be displayed.
- number - This type will allow only numeric values to be entered in the field.
- email - This type will allow valid emails addresses.
- url - This type will allow valid URLs addresses.
- tel - This type will allow valid telephone numbers.
- time - This type will allow valid time.
- date - This type will allow valid date.
- month - This type will allow valid month.
- week - This type will allow valid week.
- datetime - This type will allow valid datetime.
- datetimelocal - This type will allow valid date time in the local time zone.
- color - This type will allow selecting a color.
- textarea - This type will display a text area where multiple lines of text can be entered.
- readonly - This type will make the cell into a readonly field.
- hidden - This type will make the cell into a hidden field, the data will be sent to the output form
but not displayed in the input form.
- label - This type will make the cell into a label. This is useful to force an cell that is an input to a formula into a Label. By default all input cells are rendered as a edit box.
- button - This type will make the cell into a Button. The cell value will be used as the caption for the button. To provide a clickable URL the URL has to follow the Caption with a PIPE symbol.
Ex:
"Click Here | http://www.google.com"
- phone - This type will make the cell value into a dial-able phone number, phone dial launcher link.
- sendmail - This type will make the cell value into email launcher link.
- qty - This type generates a widget with +/- buttons on either side to increment decrement fields. Used while entering Quantity.
Special Widgets
- slider - The Min and Max of the Data Validation are used as the min and max for the slider.
- vslider - The Min and Max of the Data Validation are used as the min and max for the Vertical slider.
- filter - The list is displayed as a filterable list, where the user can type a string and filter the items based on the entered text.
- file - The user can upload a file.
- camera - The user can capture an image from the camera and upload it.
- signature - The user can enter a signature.
- gps - The Users GPS coordinates are displayed from the Location API of the browser.
- rangeslider - Cellvalue should have “min|max|Value1|value2”. This is used for filters and not in formulas. where Value1 and Value2 are the initial positions of the Left and Right Slider Buttons.
The data will be stored as a string “100-200” where 100 is the left button and 200 is the right Button. Ex: 0|1000|50|250
Images
- image
Ex:im1.image You can upload images for an app using the upload images button in the cell mapping screen. Once the image are uploaded the cells with cell type image will use the cell value to display images. so if the cell value is abc.jpg then the image will be displayed there.
You can also make an Image Clickable by passing the URL after a Pipe Symbol. Ex:
This will link to another app in XLApp.
abc.jpg|?a=123
This will link to http://www.google.co.in.
abc.jpg|http://www.google.co.in
- imagebreak
Ex:im1.imagebreak Normally the images and content are displayed in a table layout if you specify imagebreak then the image is displayed independently. This is useful for displaying header and footer images.
- imagepopup
Ex:im1.imagepopup if the cell type is imagepopup then the thumbnail of the uploaded image is displayed in the form. When the user clicks on the thumbnail the full image is displayed in a popup. The Value in the Cell Next to imagepopup Cell will be used as the title for the Image.
- imageslide
Ex:im1.imageslide if the cell type is imageslide then the thumbnail of the uploaded image is displayed in the form. When the user clicks on the thumbnail the full image is displayed in a popup with all the other images in the page as a slide show. The cell value has to have the cell name.
The caption in the image can be set by providing it after the | symbol.
product1.jpg| This is a Two ton AC running at 220v AC.
List Based Widgets
Single Select options
- switchbox
- radio
- radio horizontal
Multi Select options
Table View
tb1.tablestart tb1.tableend
In value of tb1.tablestart if “colsel” is specified then column selector displays In value of tb1.tablestart if “filter” is specified then column filter will come up you can give the value as “colsel,filter” if you want both.
Simple Sections
xlapp.sectionarea
ex:
xlapp.sectionarea.1
xlapp.sectionarea.2
To make a region of cells into sections it can be selected and the type set to xlapp.sectionarea.1.
The first cell in the section area decides how the section shows up. The valid values for the first cell are Expand Collapse Show Hide. The next cell can have the Section Caption. The cells in the subsequent rows are grouped into this section.
You can have multiple regions named as xlapp.sectionarea.2 , xlapp.sectionarea.3 etc.
Nested Sections
Regions of the forms can be grouped into sections by naming the cells with cell xlapp.sectionstart and xlapp.sectionend types.
The cell value of cell named with sectionstart* type can have “expand collapse hide show”. These will decide how the sections show up. The cell value can be an expression also so depending on another cell you can decide to show hide display or collapse a section. The cell adjacent to the sectionstart** cell will be used as the caption for the section.
Name the Cells as
xlapp.sectionstart.1 Fields .... .... xlapp.sectionend.1 xlapp.sectionstart.2 Fields .... .... xlapp.sectionend.2
If the value of the cell is show then the section is displayed. If the value of the cell is hide then the section is hidden.
If the value of the cell is expand then the section is expanded. If the value of the cell is collapse then the section is collapsed.
Section Groups
Multiple sections can be grouped into section groups. When one section in a Section group is expanded, other sections will be collapsed. So only one section in a section group can be expanded. This also called accordion widget.
xlapp.sectiongroupstart.1 xlapp.sectionstart.1 Fields .... .... xlapp.sectionend.1 xlapp.sectionstart.2 Fields .... .... xlapp.sectionend.2 xlapp.sectionstart.3 Fields .... .... xlapp.sectionend.3 xlapp.sectiongroupend.1
Tab Groups
Tab groups and tabs allow creation of tab based UI. These are similar to section groups, just that instead of being horizontal they are vertical.
xlapp.tabgroupstart.1 xlapp.tabstart.1 Fields .... .... xlapp.tabend.1 xlapp.tabstart.2 Fields .... .... xlapp.tabend.2 xlapp.tabstart.3 Fields .... .... xlapp.tabend.3 xlapp.tabgroupend.1
Menu Sections
For Menus you need two columns of data after menustart row. The first is the caption the second is the link for the item. if the link is empty the items shows up as a menu divider.
menu1.menustart Lablel LinkLablel LinkURL LinkLablel LinkURL Lablel LinkLablel LinkURL LinkLablel LinkURL menu1.menuend
Special Attributes
- recselector
ex:fname.text.RecSelector
Record Selector for Editing Records.
- OwnerEmail
ex:email1.email.OwnerEmail
ex:email1.list.OwnerEmail
Owner Email for Assigining Editable records to others.
- disabled
data1.text.disabled
data1.list.disabled
data1.email.disabled
This disables the input and the data in disabled cells are not submitted to the output form.
Searching on Input page. q1.text.search
Input Filter
Add a button with this name to apply filters on the input page.
btn1.button.inputfilter
Refreshing Input Forms from a Cell
- Refresh
ex:data1.text.Refresh ex:data1.list.Refresh
In certain cases it might be needed to recalculate the input form when the value in a cell changes. The normal way of doing this is to check the “Need Input Refresh” box in the app settings screen. The issue with “Need Input Refresh” is that all the input cells will trigger a recalculation. If you do not want this then, If the special attribute for a cell is set to refresh then a change in that cell will trigger the input form recalculation.
- refreshnovalidate
Normally when Refreshing the form the validations are also executed. In some cases you might want to do the validations only when saving (hitting the Go Button). In this case you can set the type to to refreshnovalidate.
Special Types
- ht1.html
The contents in the cells with cell type html will display the cell values directly. This can be used to output special html content. The content will be bound in the cell.
- ht1.htmlbreak
The contents in the cells with cell type htmlbreak will display the cell values directly. This can be used to output special html content. The content will be displayed independently. htmlbreak - will stop and restart the table so data flows are different.
- ht1.htmlinclude
You can Include html files using this tag. The cell value should have the name of the file you want to include ex: mytable.inc . You have to upload the file with extension .inc using the upload images button.
Predefined CellNames .
The following are cellnames that can be assigned to cell to retrieve XLApp variables like Current Logged in Username, email etc .
- _g_username
- _g_userid
- _g_email
- _g_ip
- _g_proxy
- _g_useragent
Ex: _g_email.email.OwnerEmail
Form Titles.
- title
Name Cell as “title1.title” and assign it to the input form.
General Excel Features
You can also use general Excel features in XLApp. Some of the features are:
- Tab Color.
- Merge Cells.
- Text Color.
- Grid Color.
- Text Alignment.
Colors in Cells
You can set the color of a cell using the following syntax
[CellValue]~#[CellStyle]
ThisIsRed~#ff0000
Positioning Buttons
Positioning These Names can be set for any cell to place system widgets.
xlapp.position.gobutton ⇒ Positions the Go - Submit button.
xlapp.position.recsel ⇒ Positions the Record Selector and RecordFilter. The value determines the Labels in the Selector dropdown. Ex - “Add New Name|Edit Name :”
xlapp.position.inputmenu ⇒ Positions the Input Menu ( On the Home Input page ).