Versions Compared

Key

  • This line was added.
  • This line was removed.
  • Formatting was changed.

Fields in PWR Apps represent what the columns represent in relational databases. It can store data values that are required for a particular object in a record. Fields can store different types of data.

Steps to configure:

  1. Goto Component section

    Image Removed

  2. Search and select the field component

  3. Drag and drop the field component in the layout

    Image Removed

Configuration of a Field component:

...

...

Name: Name is the unique identifier of the component in the layout

...

Label: The text that is inserted into the component of the field is known as the label. Users can change the field label 

...

Show Horizontal line: By checking this checkbox, the user will be able to view the horizontal line in view mode 

...

Placeholder: A placeholder is a text, located inside a field. It is an additional hint, description, or example of the information required for the field. The Placeholder text is editable 

...

Field Type: It is a type used to create a field 

...

Overview

  • The Field is a generic component using which you can accept values in different formats and data types

  • e.g. number, phone, email, text, etc

  • It can be bound with the model Field and variable

  • If you want to accept/display data to the user without an object you can use the Field component

Attributes

Label

  • The label is a short description of the field that will be displayed before the data input/output

Placeholder

  • A placeholder is a short text, located inside the input data field

...

Layout

  • It is a design using which the user can arrange the fields.

  • The Layout options arecomes in 5 different forms:

  • Stacked:

    The

    In a stacked layout

    allows the vertical arrangement of the field label and placeholderHorizontal: The horizontal layout allows the horizontal arrangement of the field label and placeholder Single

    , the input/output field is under the field label with a small margin around the label, and the input/output field

  • Horizontal: In a horizontal layout, the input/output field is in front of the field label with a small margin around the label, and the input/output field

  • Single Column: A Single Column layout is

    arranged as columns, with all heights being equal (This works

    the same as

    horizontal but the distance between field label and placeholder is minimized) 

    a horizontal layout the only difference is the input/output field size is greater than the field label in a layout

  • No Label: In the No Label layout, the label name is not

    visible 

    visible only the input/output field is present in the layout

  • Compact: Compact

    arrangement allows to arrange fields compact i.e., without having any space aroundHide Space: Using this checkbox, the user can hide spaces on 3 sides of the field i.e., left, right & bottom  

    layout is the same as a stacked layout, the difference is there is no margin around the label and the input/output field

...

...

  • This feature is used to make a field a hyperlink

  • Is Clickable: If URL is available as a link in a field, then this checkbox can be used to make the field clickable or non-clickable 

  • Inline Edit: This checkbox allows the user to edit the field directly in view mode field

  • This value will serve as a hyperlink text

Inline Edit

  • The inline edit feature allows us to edit the record without pressing the edit button

Debounce Time in seconds

...

  • Debounce Time is the interval that must pass before calling the next action 

  • Value Destination Type: This attribute decides if the user wants to save a value in a variable or model   

  • Value Destination Variable: From the value destination variable, the user can choose the variable in which the user wants to save the value of the power apps field

  • Value Destination Model: From the value destination model, the user can choose the specific model in which the user wants to save the value of the power apps field

  • Component Size: The user can modify the size of the component in the layout as per grid size

  • Margin Location: Defines the position of the margin for a field. It is applicable to around, top, left, bottom, right, horizontal, vertical

  • Margin Size: The margin size of view can be set to none, xxx-small, xx-small, x-small, small, medium, large, x-large, xx-large

  • Style: Style describes how fields should be rendered in preview mode. Users need to create one cdn link from the CSS tab on the layout designer page to use the style

  • Classes: Classes are used to apply unique styling and formatting to the fields in preview mode. Users need to create one cdn link from the CSS tab on the layout designer page for using classes

  • Visibility Type: Specifies whether the field is visible or not

    • Always: The field is always visible

    • Conditional: Visibility of a field depends on the given condition or criteria

  • Required Type:

    • Never: The field is not required

    • Always: It must be a mandatory field

    • Conditional: Depending on the required criteria, the field can be set as required or not 

  • Required Error Message: The user can enter a custom error message for the required field 

  • Show Success Message: Using this checkbox, the user can show a success message  

  • Success Message: The user can enter a success message when the show success message checkbox is true

  • Show Error Message: Using this checkbox, the user can show an error message on the layout

  • Error Message: The user can enter an error message when the show error message checkbox is true

  • Read only Typetime taken to complete the two actions

  • e.g. When you click on the save button, the time it takes to complete the save action is debouncing time

Validations

  1. Required Type: Ensures that a specific type of input is required.

  2. Required Error Message: Specifies the error message to be displayed when the required type is not provided.

  3. Minimum Length: Specifies the minimum length of input required.

  4. Min Length Error Message: Specifies the error message to be displayed when the input length is less than the minimum required length.

  5. Maximum Length: Specifies the maximum length of input allowed.

  6. Max Length Error Message: Specifies the error message to be displayed when the input length exceeds the maximum allowed length.

  7. Pattern: Specifies a pattern or format that the input must adhere to.

  8. Pattern Error Message: Specifies the error message to be displayed when the input does not match the specified pattern.

Read-only:

Never: The field cannot be read-

...

only

...

 Always: The field

...

will be always read-

...

only

...

 Conditional: Depending on the read-only criteria, the field can be set as read-only or

...

not

 

Disable:

Never: The field cannot be disabled

Always: The field

...

will be always disabled

...

 Conditional: Depending on the disability criteria, the field can be set as disabled or not