Description:
This widget shows a rating control that enables users to choose a rating.
Inputs
- ID/Name - Name of the widget generated by FlowWright
- Number of Stars - Enter the value (e.g., 5 for five stars)
- Required - Select the checkbox for mandatory (tick mark)
- Hide - Select the checkbox to hide (tick mark)
- Lock Widget - Click the button to toggle the lock/unlock feature
- Read Only - Select the checkbox to Read-Only (tick mark)
- Tool Tip - Enter information to display on mouse hover on form render
- Styles - Enter the CSS scripts for widget styles
- Apply Classes - Select between custom classes defined
- Globalize - When applicable
- Translate - Click to translate the text
- Save Translation - Click to save the translated text
- Save - Save the input values
- Delete - Remove this form widget from the designer page
- Close - Close the input popup window
Design:
Typical Workflow Suggestions:
The following five examples illustrate potential uses for a rating field. They assume the widget can capture a rating, which you must verify against its implementation.
Customer Satisfaction Survey
Include the Ratings widget in a customer feedback form to collect a rating of the customer's experience with a product or service.
Employee Feedback
Consider using the widget in an internal feedback form to capture employees' ratings of a training session, internal service, or workplace initiative.
Service Request Evaluation
Use a rating field in a service evaluation form to collect feedback about the quality of support received after a request is completed.
Training Session Evaluation
Include the widget in a training feedback form so participants can rate the usefulness or effectiveness of a training session.
Product or Service Review
Consider using the widget in a review form where users rate a product or service before submitting feedback.
Example:
Let’s build and execute the “RatingsDef” example.
- Create a new Form Definition called “RatingsDef.”
- Drag a “BootstrapGrid, Label, Ratings, and Submit” control onto the canvas and arrange them as shown below.
- Double-click the “Ratings” control to configure its “Settings” properties. A pop-up window opens for setup. Enter a name for the control. Set the star count. Select the “Required” checkbox for mandatory user input. Select the “Hide” checkbox to hide this widget at runtime. Select the “Read-Only” checkbox to view the list without making a selection. Click the “Lock Widget” button to toggle the lock/unlock feature and prevent accidental configuration changes. Click the “Save” button.
- Double-click the “Ratings” widget to configure its “Styling” properties. Select the input width from the drop-down list. Enter the CSS syntax. Choose the classes to apply from the global drop-down list. Click the “Save” button.
- Double-click the “Ratings” widget to set up the “Other” options. Enter the tooltip text. Click the “Save” button.
- Double-click the “Ratings” widget to configure the “Globalize” properties. The application will alert you if nothing needs to be globalized, as shown below. Otherwise, select a language from the drop-down list, then click the “Translate” button. You can overwrite the translated text with something more suitable for your style. Click the “Save Translation” button.
- Navigate to Page > Globalization menu. Select a language from the drop-down list and then click the “Translate” button. Click the “Save” button.
- Save the Form definition. Select Actions > Create Form Instance. Generate a new form instance, then check the box to edit it.
- The Form is displayed to the user, as shown below. Provide a rating and click the “Submit” button.
- Select the culture flag to view the control in a globalized format.
Tips:
- Verify the rating scale: Determine how many rating levels are available and whether you can configure them.
- Test selection behavior: Check whether users can select, change, or clear a rating.
- Check mandatory-field support: Verify whether you can require a rating before form submission.
- Test saved values: Confirm that a selected rating persists when the form is reopened.
- Validate downstream use: If the rating is used in reporting or workflow decisions, verify the stored value and its interpretation.
Definition Sample:
You may download and extract the sample definition(s) from the link provided and later import them (drag-and-drop) into your FlowWright Process Definition (XML file) or Form Definition (HTML file) page.
Note: After the import, verify and complete any missing configuration steps, such as file path references and database connections. Then, save the definition to confirm the changes.
Click here to download the sample file.