Types, Sections, Elements How To's

From Pengower
Jump to: navigation, search

Here are the things you need to know when creating and editing Types, Sections, and Elements in your application.

Contents

Types

How to create Types

Types or data types represent a description of a "Type of" a data object. Read Types to learn more about Types

Tutorial Video

Step by Step Guide

1. Go to the TYPES tab, then click on the NEW TYPE button.

Types howto1.jpg

Types howto2.jpg

2. Choose a name for your Type by filling out the TITLE field.

Types howto3.jpg

3. (OPTIONAL) Put in a description for your Type using the DESCRIPTION field.

Types howto4.jpg

4. Click on the UPDATE button to save.

Types howto5.jpg


See Also

How to Set an Icon for a Type

How to create Sections

How to create Elements

How to Set an Icon for a Type

Setting an Icon for a Type or a Data Type helps users identify them while using the application.

Tutorial Video

Step by Step Guide

1. Choose the type you want to set an icon to.

Seticon howto1.jpg

2. Click on the SELECT ICON button. A pop up window should appear.

Seticon howto2.jpg

3. Choose first a LIBRARY.

Seticon howto3.jpg

Then, choose a CATEGORY.

Seticon howto4.jpg

Then choose an ICON COLOUR and DESIGN.

Seticon howto5.jpg

Lastly, choose an ICON VARIANT.

Seticon howto6.jpg

Seticon howto7aa.jpg

Seticon howto8.jpg

Seticon howto9.jpg

4. Click on the UPDATE button to save.

Seticon howto10.jpg

Seticon howto11.jpg

See Also

How to create Types

How to set Icons for Actions


How to add indexes to a Type

Indexes allow us to determine the headings which are displayed when data records are listed. They also determine which data is shown as part of a relationship rendering, and also the "title" of a data record when it is listed in the 'Recent Items' Sidebar.

Tutorial Video

Step by Step Guide

1. Open the Type you wish to add indexes to.

How to add indexes to a Type 1.jpg

2. Click on the EDIT INDEXES button. A new pop up window should appear.

How to add indexes to a Type 2.jpg

3. Click on the Indexes drop down box and select the Element you want to add

How to add indexes to a Type 3.jpg

4. Click on the ADD INDEX button beside it to add the Element to Indexes.

How to add indexes to a Type 4.jpg

5. You can add an Element to the List Display section by clicking on the ADD TO DISPLAY LIST button beside it.

How to add indexes to a Type 6.jpg

How to add indexes to a Type 7.jpg

6. You can also add an Element to the Relationship Display section by clicking on the ADD TO RELATIONSHIP LIST button.

How to add indexes to a Type 8.jpg

How to add indexes to a Type 9.jpg

7. Click on the UPDATE button to save your changes under Indexes.

How to add indexes to a Type 10.jpg

8. Click on the UPDATE button and the UPDATE APPLICATION button respectively.

How to add indexes to a Type 11.jpg

Sections

How to create Sections

Sections are used when Data Types contain lots of different data. They can be divided and placed into different tabs which makes it easier for users to view data that are associated together.

Tutorial Video

Step by Step Guide

1. Select the Type you want to add a Section to.

Sections-howto1.jpg

2. Then click on the ADD SECTION button.

Sections-howto2.jpg

3. Choose a name for the section by filling out the TITLE field.

Sections-howto3.jpg

4. (OPTIONAL) You can add a description by filling out the DESCRIPTION field.

Sections-howto4.jpg

5. Click on the UPDATE button to save your Section.

Sections-howto5a.jpg

See Also

Sections

How to create Elements

How to create Types

How to restrict access to a Section

Data type Sections can be hidden to a specific user type. You can restrict access based on a user type.

Tutorial Video

Step by Step Guide

1. Open a Data Type and open the Section you want to restrict access to.

Section restrict access how to 1.jpg

Section restrict access how to 2.jpg

2. Just under the DESCRIPTION field, you can see the Excluded user types. By default, user types once created are found on the OPTIONS box. This means that they can have access to this section.

Section restrict access how to 3.jpg

3. Choose the user type you want to hide this section to by clicking on it twice or by clicking on the move right button. You should now see it get transferred to the selected box.

Section restrict access how to 4.jpg

Section restrict access how to 5.jpg

4. Click on the UPDATE button to save.

Section restrict access how to 6.jpg

See Also

Sections

How to create Sections

How to create Elements


Elements

How to create Elements

Elements are components in the application that represents content like text, fields, action buttons, etc. Its' attributes are specified in the Pengower Builder.

Tutorial Video

Step by Step Guide

1. Choose a Section you want to add an Element to.

Elements1.jpg

2. Click on the NEW ELEMENT button

Elements2.jpg

3. Choose a name for your Element by filling out the 'Title' field.

Elements3.jpg

4. Select the Type of Element you want to create.

Elements4.jpg

5. Save the current state of your Element by clicking on the UPDATE button.

Elements5a.jpg

6. Choose a rendering option for your Element.

Elements6.jpg

Elements7.jpg

7. Complete the required parameters of your selected rendering options.

Elements8.jpg

8. Click on the UPDATE button to save your Element.

Elements9.jpg

Elements10a.jpg

See Also

Elements

Element Types

Element Rendering Guide

How to create Types

How to create Sections

How to Set an Element's appearance

Type, Section and Element Naming


How to create an Attachment Element

Attachment Elements allow users to attach files and documents in their application.

Tutorial Video

Step by Step Guide

1. Choose a Type and Section you want to add the Attachment Element to.

Attachments-howto1.jpg

Attachments-howto2.jpg

2. Click on the NEW ELEMENT button

Attachments-howto3.jpg

3. Select a Name for your element using the TITLE field.

Attachments-howto4.jpg

4. Then under element type, choose ATTACHMENT

Attachments-howto5.jpg

5. Click on the UPDATE button to save.

Attachments-howto6.jpg

6. Set the elements appearance by clicking on the RENDERING button under Options.

Attachments-howto7.jpg

7. Choose a rendering option

Attachments-howto8.jpg

8. Click on the UPDATE button to save your rendering option.

Attachments-howto9.jpg

9. Click on the UPDATE button again to save your element.

Attachments-howto11.jpg

See Also

Elements

Element Types

Element Rendering Guide

How to Set an Element's appearance

How to create Elements

How to create a Reference Element

How to create a Number Element

How to create a custom HTML Element

How to create a Richtext Element

How to create a Date/Time Element


How to create a Reference Element

Reference Elements enable users to give data records an identification number that is unique to each record entry. This is commonly used for data records like people, orders, transactions, and many more.

Tutorial Video

Step by Step Guide

1. Choose the data type and section you want to place the reference element to.

Reference-howto1.jpg

Reference-howto2.jpg

2. On the section tab, click on the NEW ELEMENT button

Reference-howto3.jpg

3. Choose a name for your element

Reference-howto4.jpg

4. Under Element type, choose AUTO GENERATE.

Reference-howto5.jpg

5. Click on the UPDATE button to save our element.

Reference-howto6.jpg

6. Click on the RENDERING button to choose a rendering option for our element.

Reference-howto7.jpg

7. Under options, choose SEQUENTIAL

Reference-howto8.jpg

8. Fill out the needed Parameters using a prefix you want to use.

Reference-howto9.jpg

9. Click on the UPDATE button to save your rendering option

Reference-howto10.jpg

10. Click on the UPDATE button again to save your element.

Reference-howto11.jpg

See Also

Elements

Element Types

Element Rendering Guide

How to Set an Element's appearance

Type, Section and Element Naming

How to create a Number Element

How to create a custom HTML Element

How to create a Number Element

A Number element is a field that only accepts numeric characters. This element is often used for currencies, percentages, and other number only values for calculation purposes.

Tutorial Video

Step by Step Guide

1. Choose a type and section you want to add this element to.

Number-hw1.jpg

Number-hw2.jpg

2. On the section view, click on the NEW ELEMENT button.

Number-hw3.jpg

3. Choose a name for this element by filling out the TITLE field

Number-hw4.jpg

4. Under element type, choose NUMBER

Number-hw5.jpg

5. Click on the UPDATE button to save.

Number-hw6.jpg

6. Click on the RENDERING button under options. A pop up window should appear

Number-hw7a.jpg

7. Choose CURRENCY under options

Number-hw8.jpg

8. Fill out the required parameters.

Number-hw9.jpg

8. Click on the UPDATE button to save the rendering options.

Number-hw10.jpg

9. Click on the UPDATE button again to save your element

Number-hw11.jpg

You now have created a number element.

See Also

Elements

Element Types

Element Rendering Guide

How to create a Selectable Choice Element

How to Set an Element's appearance

How to make an Element Essential

How to display Elements from a Related Type

How to hide an Element

How to set the Element's Security


How to create a custom HTML Element

A Custom HTML Element allows you to embed fixed HTML on a form or record.

Tutorial Video

Step by Step Guide

1. Open the data type and section you want to add this element to.

Custom HTML element how to 1.jpg

Custom HTML element how to 2.jpg

2. Click on the NEW ELEMENT button.

Custom HTML element how to 3.jpg

3. Choose a name for your element by filling out the TITLE field.

Custom HTML element how to 4.jpg

4. Under type, choose INFORMATION

Custom HTML element how to 5.jpg

5. Click on the UPDATE button

Custom HTML element how to 6.jpg

6. Click on the RENDERING button under options. A new pop up window should appear

Custom HTML element how to 7.jpg

7. Under Option, choose INFORMATION

Custom HTML element how to 8.jpg

8. Now under the parameters, we'll see a text box appear. This is where we'll put in our HTML script. Place your HTML Script inside the box.

Custom HTML element how to 9.jpg

9. Click on the UPDATE button to save your rendering option.

Custom HTML element how to 10.jpg

10. Click on the UPDATE button again to save your element and click on the update application button.

Custom HTML element how to 11.jpg


You can now see the the html element we just created. You now have created and displayed a custom html element.

Custom HTML element how to 13.jpg

See Also

Elements

Element Types

Element Rendering Guide

How to create Types

How to create Sections

How to Set an Element's appearance

Type, Section and Element Naming

How to create an Attachment Element

How to create a Richtext Element

A Richtext element is an element in your application that supports text and page formatting. This enables you to edit font style, type, colours and many more.

Tutorial Video

Step by Step Guide

1. Open the data type and section you want to add this element to.

Richtext element how to 1.jpg

Richtext element how to 2.jpg

2. Click on the NEW ELEMENT button. A new window tab should appear.

Richtext element how to 3.jpg

3. Choose a name for your application by filling out the TITLE field.

4.(Optional) You can put in a description using the DESCRIPTION field.

Richtext element how to 4.jpg

5. Under type, choose CONTENT.

Richtext element how to 5.jpg

6. Click on the UPDATE button to save.

Richtext element how to 6.jpg

7. Click on the RENDERING button under options. A new pop up window should appear

Richtext element how to 7.jpg

8. Under options, choose STANDARD.

Richtext element how to 8.jpg

9. Click on the UPDATE button to save your rendering option.

Richtext element how to 9.jpg

10. Click on the UPDATE button again and the UPDATE APPLICATION button.

Richtext element how to 10.jpg

Richtext element how to 11.jpg

When you view your application, you should now see the richtext element you just created

Richtext element how to 12.jpg

See Also

Elements

Element Types

Element Rendering Guide

How to create a Selectable Choice Element

How to Set an Element's appearance

How to make an Element Essential

How to display Elements from a Related Type

How to hide an Element

How to set the Element's Security


How to create a Date/Time Element

Date/time elements are used to record calendar dates in your application. This element is often used to show birth dates, date ranges, calendar dates and other date related information.

Tutorial Video

Step by Step Guide

1. Choose a type and section you want to add this element to.

Datetime-hw1.jpg

Datetime-hw2.jpg

2. On the section view, click on the NEW ELEMENT button.

Datetime-hw3.jpg

3. Choose a name for this element by filling out the TITLE field

Datetime-hw4.jpg

4. Under the element type, choose DATE/TIME

Datetime-hw5.jpg

5. Then, click on the UPDATE button to save.

Datetime-hw6.jpg

6. Click on the RENDERING button under options. A pop up window should appear

Datetime-hw7.jpg

7. Choose SIMPLE DATE/TIME under options.

Datetime-hw8.jpg

8. Click on the UPDATE button to save your rendering option

Datetime-hw9.jpg

9. Click on the UPDATE button again to save your element.

Datetime-hw10.jpg

You now have created a date/time element.

See Also

Elements

Element Types

Element Rendering Guide

How to Relate Types (Create Relationships Between Types)

How to display a related Type in an Element

How to display Elements from a Related Type

How to create an Action Button Element

How to create Multiple Choice Elements

How to list a group of a Type in an Element

A Group is a subset or a subcategory of a Record Type. It can be used to list records in a much more flexible and efficient way than can be done with the standard listings. It also allows related items to be shown in a listing format from within a record. We can list a Group in an Element.

Tutorial Video

Step by Step Guide

1. Open the Type and Section you wish to add an element to.

List a group 1.jpg

List a group 2.jpg

2. Click on the NEW ELEMENT button. A new tab should appear.

List a group 3.jpg

3. Choose a name for your element using the TITLE field

List a group 4.jpg

4. Under type, choose Group.

List a group 5.jpg

5. Click on the UPDATE button.

List a group 6.jpg

6. Click on the RENDERING button under options. A new pop up window should appear.

List a group 7.jpg

7. Under rendering options, choose STANDARD

List a group 8.jpg

8. Under Parameters, choose name of your Group.

List a group 9.jpg

9. After you have filled out the needed parameters, click on the UPDATE button to save.

List a group 10.jpg

10. Click on the UPDATE button again to save the element.

List a group 11.jpg

List a group 12.jpg

See Also

Elements

Element Types

Element Rendering Guide

How to Create Groups

How to create a Number Element

How to create a custom HTML Element

How to create a Richtext Element

How to create an Action Button Element

Action buttons are elements in your application in a form of clickable buttons that when clicked, performs an action.

Tutorial Video

Step by Step Guide

1. Open the Type and Section you want to add the action button to.

Action button how to 1.jpg

Action button how to 2.jpg

2. Click on the NEW ELEMENT button. A new window tab should appear

Action button how to 3.jpg

3. Let's choose a name for our Element using the TITLE field.

4. (OPTIONAL) You can also put in a description for your Element by filling out the DESCRIPTION field.

Action button how to 4.jpg

5. Choose Action Button under Type

Action button how to 5.jpg

6. Click on the UPDATE button

Action button how to 6.jpg

7. Set a rendering option for this element by clicking on the RENDERING button under options. A pop up window should appear.

Action button how to 7.jpg

8. Under options, let's choose 'Linked'

Action button how to 8.jpg

9. Under the parameters field, choose the name of the action you wish to link this button to.

Action button how to 9.jpg

10. Click on the UPDATE button to save your rendering option

Action button how to 10.jpg

11. Click on the UPDATE button and the UPDATE APPLICATION button as well.

Action button how to 11.jpg

Action button how to 12.jpg

You now have created an Action button.

Action button how to 13.jpg

See Also

Elements

Element Types

Element Rendering Guide

How to create a Reference Element

How to create a Number Element

How to create a custom HTML Element

How to create a Richtext Element

How to create a Date/Time Element

How to create Multiple Choice Elements

Multiple choice element enables users to set several options or choices which their audience can choose from.

Tutorial Video

Step by Step Guide

1. Choose the data type and section where you want to add the multiple choice element to.

Multiplechoice-howto1.jpg

Multiplechoice-howto2.jpg

2. On the selected section, click on the NEW ELEMENT button.

Multiplechoice-howto3.jpg

3. Choose a name for your element using the TITLE field.

Multiplechoice-howto4.jpg

4. Then under element type, choose MULTI SELECT

Multiplechoice-howto4a.jpg

5. Click on the UPDATE button to save

Multiplechoice-howto5.jpg

6. Add the list of options or choices for the multiple choice element by clicking on the LIST ITEM button

Multiplechoice-howto6.jpg

7. Add options by putting in the item name at the text box and pressing Enter.

Multiplechoice-howto7.jpg

Multiplechoice-howto8.jpg

8. Click on the UPDATE button to save.

Multiplechoice-howto9.jpg

9. Set the appearance of this element by clicking on the RENDERING button under options.

Multiplechoice-howto10.jpg

10. Then under options, choose a rendering option

Multiplechoice-howto11.jpg

11. Click on the UPDATE button to save your rendering options

Multiplechoice-howto12.jpg

12. Click on the UPDATE button again to save your element.

Multiplechoice-howto13.jpg

Multiplechoice-howto14.jpg

See Also

Elements

Element Types

Element Rendering Guide

How to create a Selectable Choice Element

How to Set an Element's appearance

How to make an Element Essential

How to display Elements from a Related Type

How to hide an Element

How to set the Element's Security

How to create a Selectable Choice Element

Selectable element enables users to set several options or choices where their audience can choose only one of them. This is usually used on elements like Gender, Sex, questions answerable by yes or no, and more.

Tutorial Video

Step by Step Guide

1. Choose the data type and section where you want to add the Selectable element to.

Selectable-howto1.jpg

Selectable-howto2.jpg

2. On the selected section, click on the NEW ELEMENT button.

Selectable-howto3.jpg

3. Choose a name for your element using the TITLE field.

Selectable-howto4.jpg

4. Then under element type, choose SELECTABLE

Selectable-howto5.jpg

5. Click on the UPDATE button to save

Selectable-howto6.jpg

6. Add the list of options or choices for the multiple choice element by clicking on the LIST ITEM button

Selectable-howto7.jpg

7. Add options by putting in the item name at the text box and pressing Enter.

Selectable-howto8.jpg

8. Click on the UPDATE button to save.

Selectable-howto9.jpg

Selectable-howto10.jpg

9. Set the appearance of this element by clicking on the RENDERING button under options.

Selectable-howto11.jpg

10. Then under options, choose a rendering option

Selectable-howto12.jpg

11. Click on the UPDATE button to save your rendering option

Selectable-howto13.jpg

12. Click on the UPDATE button again to save your element.

Selectable-howto14.jpg

Selectable-howto15.jpg

See Also

Elements

Element Types

Element Rendering Guide

How to create Types

How to create Sections

How to Set an Element's appearance

Type, Section and Element Naming

How to create an Attachment Element

How to create an Action Button Element

How to create Multiple Choice Elements


How to Set an Element's appearance

Setting the appearance of your element or Element rendering is how elements are presented to users in your application. By setting a rendering option of your element, you are able to choose its appearance.

Tutorial Video

Step by Step Guide

1. Choose a Type and a Section you want to edit an Element's appearance.

Appearance-howto1.jpg

Appearance-howto2.jpg

2. Create an element by clicking on the NEW ELEMENT button.

Appearance-howto3.jpg

3. Label your element by choosing a name by filling the TITLE field.

Appearance-howto4.jpg

4. Select the element's type.

Appearance-howto5.jpg

5. Click on the UPDATE button to save.

Appearance-howto6.jpg

6. Set the element's rendering by clicking on the RENDERING button under options.

Appearance-howto7.jpg

7. Under options, choose a rendering option.

Appearance-howto8.jpg

8. Then complete the needed parameters.

Appearance-howto9.jpg

9. Click on the UPDATE button to save your rendering option.

Appearance-howto10.jpg

10. Click on the UPDATE button again to save your element.

Appearance-howto11.jpg

See Also

Elements

Element Types

Element Rendering Guide

How to create a Reference Element

How to create a Number Element

How to create a custom HTML Element

How to create a Richtext Element

How to create a Date/Time Element


How to make an Element Essential

Making an element essential means that users are required to fill out the said element. This is usually used when important information are needed to be filled out before proceeding.

Tutorial Video

Step by Step Guide

1. Choose a type and section where you want to make an element essential.

Essential-howto1.jpg

Essential-howto2.jpg

2. Open an existing element you've created.

Essential-howto3.jpg

3. Below the description text box, you can see the ESSENTIAL check box. Tick the box.

Essential-howto4.jpg

4. Click on the UPDATE button again to save your element.

Essential-howto6.jpg

See Also

Elements

Element Types

Element Rendering Guide

How to create a Reference Element

How to create a Number Element

How to create a custom HTML Element

How to create a Richtext Element

How to create a Date/Time Element


How to hide an Element

Some elements may be added to records to assist with the management of the record, but they may not need to be visible to the users.

Tutorial Video

Step by Step Guide

1. Open the Type and Section where your element you want to hide is located.

Hide Element how to1.jpg

Hide Element how to2.jpg

2. Open your element by clicking on it. A new tab should appear

Hide Element how to3.jpg

3. Under the DESCRIPTION field, check on the HIDDEN checkbox. Activating this would enable you to hide your element.

Hide Element how to4.jpg

4. Click on the UPDATE button to save your element.

Hide Element how to5.jpg

You now have hidden an element.

See Also

Elements

Element Types

Element Rendering Guide

How to list a group of Types in an Element

How to display a related Type in an Element

How to display Elements from a Related Type

How to create an Action Button Element

How to create Multiple Choice Elements

How to set the Element's Security

An Element's security enables you to set which user or user types can view and/or edit an element.

Tutorial Video

Step by Step Guide

1. Open the type and section where your element is found.

Element security how to 1.jpg

Element security how to 2.jpg

2. Select the element you want to set security to.

Element security how to 3.jpg

3. Click on the SECURITY button just under Options. A pop up window should appear.

Element security how to 4.jpg

4. You can adjust Read only Access and No Access by placing the user type to the selected box by clicking the MOVE RIGHT button.

Element security how to 5.jpg

Element security how to 6.jpg]

Element security how to 7.jpg

5. Once you have done making changes, you can click on the UPDATE button.

Element security how to 8.jpg

6. Click on the UPDATE button again to save your element

Element security how to 9.jpg

You have now set an element's security.

See Also

Elements

Element Types

Element Rendering Guide

How to create Types

How to create Sections

How to Set an Element's appearance

Type, Section and Element Naming

How to create an Attachment Element