HomeDev GuideRecipesAPI Reference
Dev GuideAPI ReferenceUser GuideLegal TermsGitHubNuGetDev CommunityOptimizely AcademySubmit a ticketLog In
Dev Guide

Load resources

Shows how to load additional resources after form rendering with IViewModeExternalResources.

📘

Note

Optimizely Forms is only supported by MVC-based websites and HTML5-compliant browsers.

You can load additional resources after form rendering with IViewModeExternalResources. Implement the IViewModeExternalResources interface to return a list of resources (JavaScript or CSS files) that are loaded into ViewMode along with EPiServerForms.js.

The interface is used mostly for the following:

  • Third-party validators.
  • Rich element types (with rich, complex user interface that needs JavaScript to render UI and handle interaction), such as DateTimeElement in the Forms.Samples project.
using EPiServer.Forms.Core;
using EPiServer.ServiceLocation;
using System;
using System.Collections.Generic;

namespace EPiServer.Templates.Alloy.FormsExtended {
  /// <summary>
  /// This example will force Forms.Core to load a JS and a CSS file 
  /// (at http://example.com/Customized/ViewMode/Alloy.css) along with Form rendering
  /// </summary>
  [ServiceConfiguration(ServiceType = typeof (IViewModeExternalResources))]
  public class ExampleViewModeExternalResources: IViewModeExternalResources {
    public IEnumerable<Tuple<string, string>> Resources {
      get {
        var arrRes = new List<Tuple<string, string>>();
        arrRes.Add(new Tuple<string, string>("script", "/Customized/ViewMode/Example.js"));
        arrRes.Add(new Tuple<string, string>("css", "/Customized/ViewMode/Example.css")); 
        // The above line will not work in nonJS mode
        return arrRes;
      }
    }
  }
}