Create a Validation
      Back to home
      1. Customer Support Center
      2. Create Apty Content
      3. Create a Validation

      Create Validations

      Getting immediate guidance to solve your issue as you encounter it can greatly improve your experience. This is exactly what Apty's on-screen Validation feature achieves, such as validating the proper format for email addresses or phone numbers.

      Use the following steps to create a Validation,

      1.  Log in to the Apty Studio after launching it on your web browser.

      2.  Click Select Application.

      3.  Choose the application you want to work with.

      select application-1

      Note:

      4.  On your application, navigate to the page where you want to add the validation.

      Note:

      You can create Apty Content only if the application is connected with the Apty Studio. A well connected application is indicated by a green color icon.

        Connected Not Connected
      Apty Studio connected studio not connected studio
      Browser Toolbar connected browser not connected browser

       

      5.  If necessary, establish a new frame; otherwise, opt for an existing frame.

      Note:

      • Each page in your application must have a unique Frame connected with the Apty Studio to create Apty Content like Validations, Launchers, Tooltips, and Announcements.
      • The Validations screen will prompt you to create a new Frame unless it was created earlier, in which case Apty Studio will connect to one automatically. You can also choose a different Frame from the list of Frames that are already on the page. To understand the importance of Frames in the creation of Apty Content, see What are Frames.
       

      6.  Click the + icon or Create New Validation button to start creating Validations.

      create new validation

      7.  Click Select Spotlight and then hover your cursor over the element you want to select.

      Note:

      Element Selection is a default selector when the user creates a new Validation. However, you can choose one of the advanced selectors from the drop-down.

      Element Selectors

      Description

      Element Selection

      		 The Element Selection selector captures a web element on your application while creating Validations. Apty Studio captures the element which enables the Validation to appear directly next to the selected element.

      Custom Script

      You can identify an element using it's Custom Script which consists of attributes such as class, id, placeholder, etc. This option can be used in scenarios when there are a list of elements displayed together in some pattern on your application and you want your Validation to precisely point to only one of them. For example, selecting an element in a dropdown menu.

      CSS Selector

      		 The CSS Selector option is used to identify an element by it's unique id or class name. This ensures that the selector is accurate and unique to the element attached to it.

      XPath

      		 To increase accuracy, provide high-quality statistics, and speed up application performance, the XPath records and maintains the entire attribute path connected to an element on your application.

      8.  In the Apty Studio, enter your Validation Name.

      Note:

      A default Validation name will be assigned based on the element you select. However, you can modify the name according to your requirements.

      9. Under VALIDATORS, click the +Add Validator button to add a condition.

      add validator

      10. Select Regular expression from the dropdown.

      Note:

      To learn more about different validation conditions, see Advanced Conditions for Validations.

      11. Add the regular expression as shown below to authenticate the user's email id and then include an error message for when a user submits an incorrect email id.

      ^([a-zA-Z0-9_\-\.]+)@([a-zA-Z0-9_\-\.]+)\.([a-zA-Z]{2,5})$^([a-zA-Z0-9_\-\.]+)@([a-zA-Z0-9_\-\.]+)\.([a-zA-Z]{2,5})$

      12. Select a position for your Validation icon to appear on your application.

      icon position

      Tip:

      You can also customize your Validation Icon offset and choose to show or hide the icon.

      show hide icon

      13. Select your Validation theme and appearance from the dropdown.

      Note:

      By default three theme options are provided for Apty Validations:

      • Default
      • Apty Light
      • Apty Dark

      To learn how to create new themes, see Themes (Version 4.x).

      14. You can select Display Conditions for your Validations to control when and where they appear based on specific criteria. These conditions can include factors like user roles, page URLs, or custom attributes.

      For more information on display conditions, see Apty's Enhanced Rule Engine.

      15. Click Save.

      Once you create a Validation, you can make it accessible for your end users by publishing it either through the Admin Portal or the Apty Studio.

      For more information, see Publishing Apty Content(version 4.x or above).

      Note:

      • You can also add advanced customization to your Validations like adding Segments, enabling the Disable DOM elements functionality, and scheduling the timezone and date for your Validations.