jquery - Unable to run ui-calendar error: undefined is not a function -
i trying implement ui-calendar ionic application, , having severe issues, have followed instructions on documentation @ https://github.com/angular-ui/ui-calendar no matter try , calendar render nothing working. trying calendar pull event data json feed in php page have set on mysql server. page displaying event data fine , have used same code in similar working function on app also.
here header html:
<script type="text/javascript" src="lib/jquery/dist/jquery.js"></script> <script type="text/javascript" src="lib/jquery-ui/ui/jquery-ui.js"></script> <!--other libs--> <!--<script type="text/javascript" src="js/jquery-1.11.1.min.js"></script>--> <!--ionic libs--> <link rel="stylesheet" href="lib/ionic/css/ionic.css"> <script src="lib/ionic/js/ionic.bundle.js"></script> <!--my app--> <link rel="stylesheet" href="css/style.css"> <script src="js/app.js"></script> <!--will 404 during dev stage--> <script src="cordova.js"></script> <!--fullcalendar libs--> <script type="text/javascript" src="lib/jquery/dist/jquery.js"></script> <script type="text/javascript" src="lib/jquery-ui/ui/jquery-ui.js"></script> <!--<script type="text/javascript" src="lib/angular/angular.js"></script>--> <script type="text/javascript" src="lib/angular-ui-calendar/src/calendar.js"></script> <script type="text/javascript" src="lib/fullcalendar/fullcalendar.js"></script> <script type="text/javascript" src="lib/fullcalendar/gcal.js"></script>
here controller ui-calendar:
app.controller('calctrl', function ($scope, $rootscope, $log, $state) { $scope.eventsources = [ /* event source pulls google.com */ function() { var userdata = $.ajax( { url: 'urlhere', method: 'get', datatype: 'json', success: function(userdata) { //console.log(userdata); var user_count = userdata.length; var source = []; var jsondata = []; // create sources (var = 0; < user_count; i++) { var uid = userdata[i].id; if(!source[i]) source[i] = []; source[i] = 'urlhere?e=' + uid; // add each source json feed object jsondata.push({ url: source[i], type: 'get', color: userdata[i].cal_color, textcolor: userdata[i].txt_color, error: function() { alert('there error loading calendar data.');} }); } console.log(jsondata); // in console can see formed json data return jsondata; } }); } ]; });
the calendar controller thing differs documentation on ui-calendar github page. don't see missing here , has had me @ stand still while now. appreciated!
try replace code this:
$scope.eventsources = [ { events: [ { title: 'event1', start: '2011-04-04' }, { title: 'event2', start: '2011-05-05' } // etc... ], color: 'yellow', // option! textcolor: 'black' // option! } ];
if works,
$scope.eventsources = [ { events: function() { var userdata = $.ajax( { url: 'urlhere', method: 'get', datatype: 'json', success: function(userdata) { //console.log(userdata); var user_count = userdata.length; var source = []; var jsondata = []; // create sources (var = 0; < user_count; i++) { var uid = userdata[i].id; if(!source[i]) source[i] = []; source[i] = 'urlhere?e=' + uid; // add each source json feed object jsondata.push({ url: source[i], type: 'get', color: userdata[i].cal_color, textcolor: userdata[i].txt_color, error: function() { alert('there error loading calendar data.');} }); } console.log(jsondata); // in console can see formed json data return jsondata; } }); } } ];
you can see options eventsour in doc: http://arshaw.com/fullcalendar/docs/event_data/event_source_object/
Comments
Post a Comment