How to resolve the "JavaScript runtime error : '$' is undefined" with the Syncfusion controls?

Problem

JavaScript runtime error: ‘$’ is undefined

Figure 1: JavaScript runtime error: ‘$’ is undefined

Reason

The error arises when jQuery script file is not referred in the corresponding web application.

Solution

To resolve the error on undefined ‘$’, add jQuery script to the application and refer to the script files in the required page. In order to render the Syncfusion ASP.NET controls, refer to the dependent jQuery scripts and the Syncfusion specific script files.

Refer to the base jQuery script before the Syncfusion scripts, as “ej.web.all.min.js” and other EJ scripts depend on jQuery script file. Ensure the order of adding script references to avoid errors with dependent script files.

Now, the references for required files in Site.Master page is added. Refer to the following code example.

Site.Master

Refer to the following UG links to know the required files to be referred for rendering the Syncfusion ASP.NET controls:

Script references: http://help.syncfusion.com/ug/js/Documents/scriptreferences1.htm

CSS references: http://help.syncfusion.com/ug/js/Documents/cssreferences1.htm

To add controls manually: http://help.syncfusion.com/ug/js/Documents/createmanually1.htm