Why does this simple Angularjs using syncfusion throws me the error Uncaught TypeError: Cannot read property 'widget' of undefined

Question

I am relatively new to Angularjs and I am trying to use Syncfusion to implement few diagrams so I started with a simple code using the angularjs CDN provided in their website. But it throws me error. I am not sure what I am doing wrong. I could not find any post related to similar thing in SO or in Syncfusion forum. Can anyone please help me? I am really sorry if incase this is duplicate

This the help doc from their website: Help DOC Syncfusion AngularjS

This is the CDN links page: https://help.syncfusion.com/js/cdn#gsc.tab=0

Following is the code:

<!DOCTYPE html>
<html ng-app="DateCtrl">
<head>
    <title>Testing EJAngular</title>
        <!--jQuery Starts-->
        <script src="http://cdn.syncfusion.com/js/assets/external/jquery-1.10.2.min.js"></script>
        <!--jQuery Ends-->
        
        <!-- Angularjs CDN Starts -->
        <script src="http://cdn.syncfusion.com/js/assets/external/angular.min.js"></script>
        <!-- Angularjs CDN Ends -->
        
        <!--EJ Angular Starts-->
        <script src="http://cdn.syncfusion.com/18.2.0.44/js/common/ej.widget.angular.min.js"></script>
        <!--EJ Angular ENDS -->
    </script> 
</head>
<body ng-controller="DatePickerCtrl"> 
    <!--Container for ejDatePicker widget-->
    <input id="datepick" ej-datepicker e-value="dateValue" e-enableStrictMode="true" />
    
    <script type="text/javascript">
        var DateCtrl    =   angular.module('DateCtrl', ['ejangular'])
        
        DateCtrl.controller('DatePickerCtrl', function ($scope) {
            $scope.dateValue = "2/3/2013";
        });
    </script>
</body>
</html>

Error Messages from console:

So it worked. After some more tries I was able to do it. Actually there are few more CDN that needs to be added which is not mentioned in the `Angularjs` code. Below I have added the code. — BATMAN_2008, Jul 23 '20 at 09:14

score 1 · Accepted Answer · answered Jul 23 '20 at 09:15

Posting this answer as it maybe useful for someone in the future. Few more CDN needs to be added. Here is all CDN:

<link href="http://cdn.syncfusion.com/18.2.0.44/js/web/flat-azure/ej.web.all.min.css" rel="stylesheet" />
<script src="http://cdn.syncfusion.com/js/assets/external/jquery-1.10.2.min.js"></script>
<script src="http://cdn.syncfusion.com/js/assets/external/jquery.easing.1.3.min.js"></script>
<script src="http://cdn.syncfusion.com/js/assets/external/jsrender.min.js"></script>
<script src="http://cdn.syncfusion.com/18.2.0.44/js/web/ej.web.all.min.js"></script> 

<!-- Angularjs CDN Starts -->
<script src="http://cdn.syncfusion.com/js/assets/external/angular.min.js"></script>
<!-- Angularjs CDN Ends -->

<!--EJ Angular Starts-->
<script src="http://cdn.syncfusion.com/18.2.0.44/js/common/ej.widget.angular.min.js"></script>
<!--EJ Angular ENDS -->

score 1 · Answer 2 · edited Jul 24 '20 at 20:09

This issue generally arises when we haven’t referred the required Syncfusion script files. Check out the AngularJS documentation in the below link.

https://help.syncfusion.com/angularjs/overview

https://help.syncfusion.com/angularjs/accordion/getting-started#create-a-simple-accordion-in-angularjs

check the below link for DatePicker demo.

http://jsplayground.syncfusion.com/a1zdhiii

Check the below links to know more about Syncfusion AngularJS DatePicker.

Behavior : https://help.syncfusion.com/angularjs/datepicker/behavior-settings

Value binding: https://help.syncfusion.com/angularjs/datepicker/data-and-event-binding

API reference: https://help.syncfusion.com/api/js/ejdatepicker

We can also raise queries in Syncfusion forums.

https://www.syncfusion.com/forums

Thanks a lot for the response. I am new to `Syncfusion` so trying to learn from official documentation and do so I am having a lot of confusion. Actually now I am struck at another issue which I have posted here if you get a chance can you please look into this: https://stackoverflow.com/questions/63073024/syncfusion-and-angularjs-find-all-the-html-elements-values-present-in-each-of-t — BATMAN_2008, Jul 24 '20 at 14:12

Why does this simple Angularjs using syncfusion throws me the error Uncaught TypeError: Cannot read property 'widget' of undefined

2 Answers2