Walkthrough: Setting up a value provider for prefilling forms

Abstract

Example of how to set up a value provider to prepopulate the name and email fields.

Prepopulated field values in forms save your users time and improve consistency.  This walkthrough is part three of the prefilling forms walkthrough series and describes how to implement a value provider that prefills name and email fields.

Whe you create a value provider, you must create a class that inherits from the IFieldValueProvider interface.

To create the provider class:

  1. In your Visual Studio project, create a folder and name it ValueProviders.

  2. In the ValueProviders folder, create the UserProfileFieldValueProvider class and inherit from the IFieldValueProvider class.

  3. Implement the GetValue method to return an object of any type. This object would be cast in the InputViewModel implementation to the appropriate type.

    The parameters for the UserProfileFieldValueProvider  class are stored as plain strings. For example: email, fullname, or any other user profile property key you would like to use.

    You could store any other data for the parameters, for example, as JSON or XML, and parse that data in your value provider implementation.

    
     public class UserProfileFieldValueProvider : IFieldValueProvider
        {
            public User User => Context.User;
    
            public FieldValueProviderContext ValueProviderContext { get; set; }
    
            public object GetValue(string parameters)
            {
                if (User == null || !User.IsAuthenticated)
                {
                    return string.Empty;
                }
    
                switch (parameters)
                {
                    case "name":
                    case "username":
                        return User.Name;
                    case "email":
                        return User.Profile.Email;
                    case "fullname":
                        return User.Profile.FullName;
                    default:
                        return User.Profile[parameters] ?? string.Empty;
                }
            }
        }
    

To create the provider item:

  1. Navigate to /sitecore/system/Settings/Forms,  right-click Value Providers, click Insert, and click Insert from Template.

  2. Select the /sitecore/templates/System/Forms/Value Provider template.

  3. In the Item Name field, enter a name and click Insert.

  4. Navigate to the item you just created, and in the Settings section, in the Model Type field, set the value to the class type name. For example, ValueProviderSample.FieldValueProviders.UserProfileFieldValueProvider..

  5. Save the item.

To create a form:

  1. On the Forms dashboard, click Create and click Blank form.

  2. In the Form elements pane, drag the Email element to the page. In the Label field enter Email.

  3. Drag the Single-line text element to the page. In the Label field, enter Fullname.

  4. Click the Email field, and in the Form elements pane, in the Advanced settings section, in the Value provider field, select the provider you created earlier.

  5. In the Value provider parameters field, enter fullname.

  6. Click the Email field, and in the Form elements pane, in the Advanced settings section, in the Value provider field, select the provider you created earlier.

  7. In the Value provider parameters field, enter email.

  8. Save the form and name it User Profile Form.

  9. Add the User Profile Form to a web page and named it User Profile Page

  10. Add the Logout form which you created in the previous walkthrough to this User Profile Page.

To add the redirection link:

  1. Add a Redirect to Page submit action to the Login Form. Click User Profile web page as the redirect to page.

  2. In the Register Form, redirect the page to Login Web page once registration is success.

  3. In Logout form, redirect to Login Web Page when the logout success.

To check the prefilled form results:

  1. First register a user using the Register Page, then login using the email and password of the user through the Login Page.

  2. After login success, the User Profile page will display the full name and email address of this user. Click Logout to logout from the User Profile page. If no user is logged in, the User Profile page is left blank.

    FORMS-value-provider-check-form.png