1. Help Center
  2. App Creation
  3. Form Elements (Reference)

REFERENCE FORM ELEMENT

Properties of Reference Form Element

The reference element field retrieves the data into the current application elements from selected Data tables or Data sources.

Reference Form Element - Properties

The reference element has two sub-categories.

1. Data Table Reference

This category refers to the Data Table element fields to get the data from the data table onto the current App.

2. Data Source Reference

This category refers to the element fields from the data source to get the data from the data source onto the current App.

Data Table Reference option

Follow the points as given below to add data table reference properties.

  • Click on the Select Data Table drop-down, and select the Data Table that you created.

  • Click on the Select Data Table Function drop-down, and select the Data Table Function that you created.

  • The Function Type will populate as you defined in the Output type while creating the Data Functions, whether it be List or Grid.

  • Click on Select Reference Elements drop-down, and it shows the list of Elements fields that you defined in Output Elements while creating the Data Table Functions.
  • Select the elements from the drop-down of which you want to retrieve the data in your application.

  • Click on the Save button.

  • The Reference Element Field properties get to save. The element field, set as an Input function while creating the Data table function, becomes your primary Input Element field.
  • The application will show data in all the Element fields selected while defining the Reference Element Field properties and the Input Element that you defined while Creating the Data Table Functions.

  • You can see the additional Data table Reference Element in the application.

  • You can click on the Preview button to see how data table reference works.

  • Preview app page pop-up will open on the screen.

  • Click on the Data table Reference Element. It shows all the values of the element in the data table.

  • Select a value from the Reference Element Field for which you want to retrieve the data from the Data Tables.

  • The data belongs to that value is retrieved from the Data Tables into the application.

Data Table Reference –referenced File upload Element as Image in App

Create a Data table as Data table contains a File upload element. (Refer Data Table section)

  • To create a Data Table, click on the Admin Menu.

  • Click on the Data Base, and select the data table.

  • The page will redirect to the Data Tables page.

  • Select the Workspace Name from the workspace drop-down.

  • Click on the Create drop-down and select the Data Table Manually option to create a Data Table.

  • The page will redirect to create Data Table page.

  • Click on the Workspace drop-down field and select workspace.
  • Click on the Data Table Name text box.

  • Provide a valid name for the Data table.

  • You can see the elements are on the left side of the page, you can Drag-n-Drop the elements on to the Data Table form builder.
  • By default the form builder will have two elements in the data table Textbox and Date fields.

Every data table form element has 3 action buttons

  1. Copy: This is used to copy the same element type to the data table.
  2. Delete: This is used to delete the element from the data table.
  3. Settings: This is used to open Properties of the element.

  • Place the Elements you want in the Data table, set their properties.

  • Place the File upload element in the data table.

  • Click on the settings icon of the File Upload element.

  • Properties of the File Upload element will open.

  • Set the properties of the File Upload element (Refer to File Upload Element section in Form Elements- Basic).
  • Select the image type.

  • Click on the Save button to save Data Table.

  • System will ask to create CRUD Functions.
  • Click on yes, if you wish to create automatic CRUD Functions.

  • The CRUD Functions List will display on the screen.
  • Click on the Back button to go back to Data Table list.

  • The page will redirect to Data Table List page.

  • Data table will save and a success toaster message will display on the screen.

  • Create a Get function for the data table (Refer to Get Function creation section) as shown below.

  • Click on the Submit button to save Data Table Function.

  • Data function will save and a success toaster message will display on the screen, data function for the table will be shown in the grid.

App creation using Data Table Reference

  • Create an app using Data table Reference (Refer Data table Reference section)
  • Provide a valid name to the app.

  • Click on the Next button, the Form Builder page will open on the screen.
  • Place a reference element on the form builder of the app.

DTRE-1

  • Set the properties for the reference element.
  • Select the Data table reference from the category drop-down.
  • Select the data table which you want to reference for this App.
  • Select the Data table function.
  • Select the Referenced elements which you want to show in the app from the data table along with file upload form element.

  • Click on the Save button to save the properties for the Data Table Reference element.

The properties of the reference element will save and the Referred Elements will display in the App.

  • Click on the File upload element (Profile image element).
  • The properties of the element will open.

  • Select the Image Type radio button from the Properties window.

Note: If you select Image Type radio button, only an image file in the File upload element will display on the page.

  • If you select File Upload radio button, the filename and image from the data table will display on the page and it will have an option to browse and add one more image to the App.

  • Click on the Next button and set Business Rules, Access Permissions, and publish the App.
  • The app will get created successfully.
  • Now open the Add record page of the App from the custom menu.

  • Click on the Emp id Reference Element drop-down, the data in the data table for the reference element will be shown in the drop-down. Select the element data which you want to get in the app.

  • The data will retrieve from the data table and will display in the app.

  • If you do not select the File upload element type as image in the App, the app will not display the image in the app.

QR Code Base Version – Generate, View and Scan

  • Login to Quixy Application.
  • You will land on Quixy dashboard page.

  • Create a Data Table.

  • The Data Table will display in the Data Tables List.

  • Add Records to the Data Table. To Add Records, click on the Add Multiple Records option from the 3- dots icon.

  • Add Records to the data table.

  • To create a Get Function for the created Data Table click on Manage Functions action button Corresponding to the Data Table in Data Tables List Page.

  • Selected Data Table – Data Table Functions Page will display on the screen.

  • Click on the Create Data Table Function
  • Data Table - Add Data Table Function Page will display on the screen.

  • Enter all the data in required fields to create a Get Function.

  • Create an App with Data Table Reference Element as shown in below.

  • Add Data Table Reference to the form in Form Builder section.

  • In Data Table Reference Element Properties window, you will find a check box Is Enable Scanner, Check the is Enabled Scanner Check box.
  • Publish the App.
  • App will publish and a success toaster message will display on the screen.
  • Login to the Quixy Mobile App.

  • Select the App Name, and click on the Add Record option in custom menu.

  • QR Code scanner is opened to scan QR code.

Data Source Reference

To create data source reference against an form element,

  • First you need to create a data source.
  • Data source has collection of data from the data tables and Apps.(Refer to Data sources section to create Data source)
  • Click on the Reference Element,
  • Properties window of the reference element will open on the screen.
  • Click on the Select Category, select the Data source Reference option.

  • Click on the Select Data source drop-down, it contains list of data sources in the workspace.

  • Select a data source, the data which you need in the App.

  • The Reference element will automatically set, the element which is selected as the reference element while creating data source.
  • Select Type will also set automatically, it is the type of data source.

  • Click on the Select Reference Elements drop-down, which contains list of elements in the datasource.
  • Select the elements, the elements data which you needs in the app.

  • Click on the Save button in the properties window to save data source reference.

  • The Data source Reference will save, and the selected elements will add to the app.

Add record-Data source reference-file upload

  • Create a Data Source with type as Reference with a file upload element in it.
  • Create an App including Data Source Reference Element with the created Data Source in the app.
  • Open the Add Record page for the App you created.
  • Click on the Data Source Reference Element.
  • Select an element from the drop down.
  • Among the elements in the drop-down, the file upload element will display the attached files.
  • You can view the files by clicking on the file name.

Rich Text Editor – RTE element is used as Reference Element for data Table Reference / Data Source reference

While creating a Data Source Reference/ Data Table Reference include the RTE element in it and use the RTE element.

1. Data Source Reference

  • Create a Data Source with RTE element in it.
  • Create an app with Data Source Reference, and select the RTE element in Data source reference elements as shown below.

  • Open Add Record page for the Created Data source Reference app.
  • Based on the selected ID which is taken as reference, the RTE element will displayed.

2. Data Table Reference

  • Create a Data Table with RTE element in it as shown below.

  • Create an app with Data Table Reference in it, and select the RTE element in the Data Table reference.