External Client Libraries

• Mar 27, 2023
• 3 minutes to read

DevExpress MVC Extensions require that specific external libraries are available on the client. The most of our MVC Extensions are implemented as wrappers around Web Forms controls, for instance, GridView, Splitter, and Data Editors. These extensions require jQuery scripts to work properly. Other extensions are based on our DevExtreme controls and require additional external libraries, including DevExtreme resources.

To ensure an extension works correctly, you need to do one of the following:

• Add all the required external libraries.
• Add the resources section to the Web.config file so the control can load the external libraries automatically.

Required Client Libraries

Every DevExpress MVC extension requires the following scripts:

• jquery-3.5.1.min.js
• jquery.validate.min.js (1.17)
• jquery.validate.unobtrusive.min.js (3.2.6)
• jquery.unobtrusive-ajax.min.js (3.2.4)

The following extensions are based on DevExtreme controls and require additional external libraries, including DevExtreme resources:

• Dashboard
• Reports
• Query Builder
• Charts

Dashboard Required Libraries

• jquery-3.5.1.min.js
• jquery.validate.min.js (1.17)
• jquery.validate.unobtrusive.min.js (3.2.6)
• jquery.unobtrusive-ajax.min.js (3.2.4)
• knockout-3.5.0.js
• ace.js
• ext-language_tools.js
• theme-ambiance.js
• theme-dreamweaver.js
• cldr.min.js (0.4.3)
• cldr.event.min.js (0.4.3)
• cldr.supplemental.min.js (0.4.3)
• globalize.js (1.0.1)
• globalize.message.min.js (1.0.1)
• globalize.number.min.js (1.0.1)
• globalize.date.min.js (1.0.1)

• globalize.currency.min.js (1.0.0)

• DevExtreme client libraries

Reports Required Libraries

• jquery.js (3.5.1)
• jquery.validate.min.js (1.17)
• jquery.validate.unobtrusive.min.js (3.2.6)
• jquery.unobtrusive-ajax.min.js (3.2.4)
• knockout.js (3.5.1)
• cldr.min.js (0.4.3) (optional)
• cldr.event.min.js (0.4.3) (optional)
• cldr.supplemental.min.js (0.4.3) (optional)
• cldr.unresolved.js (0.4.3)(optional)
• globalize.js (1.0.1) (optional)
• globalize.message.min.js (1.0.1) (optional)
• globalize.number.min.js (1.0.1) (optional)
• globalize.currency.min.js (1.0.0) (optional)
• globalize.date.min.js (1.0.1) (optional)
• ace.js (1.4.13) (optional - code highlighting)
• ext-language_tools.js (optional - code highlighting)

• jszip.min.js (3.7.1) (optional - rich text editor)

• DevExtreme client libraries

Query Builder Required Libraries

• jquery.js (3.5.1)
• jquery.validate.min.js (1.17)
• jquery.validate.unobtrusive.min.js (3.2.6)
• jquery.unobtrusive-ajax.min.js (3.2.4)
• knockout.js (3.5.1)
• ace.js (1.4.13)
• ext-language_tools.js
• cldr.min.js (0.4.3) (optional)
• cldr.event.min.js (0.4.3) (optional)
• cldr.supplemental.min.js (0.4.3) (optional)
• cldr.unresolved.js (0.4.3) (optional)
• globalize.js (1.0.1) (optional)
• globalize.message.min.js (1.0.1) (optional)
• globalize.number.min.js (1.0.1) (optional)
• globalize.currency.min.js (1.0.0) (optional)
• globalize.date.min.js (1.0.1) (optional)
• DevExtreme client libraries

Register Client Scripts Automatically

The GetScripts(Script[]) method attaches the DevExtreme libraries to the View when you add any of the following extensions: All, Dashboard, Report, QueryBuilder, or Chart. To load both DevExtreme and third-party libraries automatically, add the following references to the resources section to the Web.config file.

<configuration>
  <configSections>
    <sectionGroup name="devExpress">
      <!-- ...  -->
      <section name="resources" type="DevExpress.Web.ResourcesConfigurationSection, DevExpress.Web.v23.2, Version=23.2.5.0, Culture=neutral, PublicKeyToken=b88d1754d700e49a" requirePermission="false" />
    </sectionGroup>
  </configSections>
<!-- ...  -->
</configuration>
<!-- ...  -->

<devExpress>
    <!-- ... -->
    <resources>
        <add type="ThirdParty" />
        <add type="DevExtreme" />
    </resources>
</devExpress>

The code snippet above allows you to register the following resources:

ThirdParty

Adds references to required third-party libraries.

DevExtreme

Adds a reference to the DevExtreme package. DevExtreme scripts are loaded only if you add any of the DevExtreme-based suites.

When you create a project from the DevExpress Template Gallery, it automatically registers the resources in the Web.config file. In this case, all necessary client-side libraries are automatically passed to the client.

Register Client Scripts Manually

Follow the steps below to specify the libraries to deploy on the client:

1. Declare an empty resources section to prevent external client scripts from loading automatically.

   <resources>
   </resources>
   

2. Attach DevExtreme resources and the third-party libraries (see the Required Script Libraries section) to the web page. DevExpress extension scripts modify the jQuery libraries for our own purposes, so you should register the resources in the following order:

   • Third-party libraries
   • The DevExtreme packages
   • Specific control scripts