jQuery Uncaught TypeError: Cannot read property 'fn' of undefined (anonymous function)

try to call jQuery library before bootstrap.js

<script src="js/jquery-3.3.1.min.js"></script>
<script src="js/bootstrap.min.js"></script>

Try this:

(function ( $ ) { 

    // put all that "wl_alert" code here   

}( jQuery ));

So, the $ variable is apparently corrupted, but the jQuery variable should still refer to the jQuery object. (In normal circumstances, both the $ and jQuery variables refer to the (same) jQuery object.)

Instead of having to replace the $ name with the jQuery name in your entire code, you can simply use an IIFE to alias the name manually. So, the outside-variable jQuery is aliased with the $ variable inside the function.

Here's a simple example to help you understand this concept:

var foo = 'Peter';

(function ( bar ) {

    bar // evaluates to 'Peter'

}( foo ));

If you get Cannot read property 'fn' of undefined, the problem may be you loading libraries in wrong order.

For example:

You should load bootstrap.js first and then load bootstrap.js libraries.

<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/bootstrap3-dialog/1.34.7/js/bootstrap-dialog.min.js"></script>

Tags:

Jquery