Backbone is not defined in Backbone - javascript

I'm just starting backbone and am getting this error.
This is my index.html file:
<script type="text/template" id="login-template">
<div>Aditya</div>
</script>
<script src="./js/router/router.js"></script>
<script src="./js/jquery-latest.js"></script>
<script src="./js/jquery-ui-1.10.4.custom.js"></script>
<script src="./js/underscore-min.js"></script>
<script src="./js/backbone-min.js"></script>
<script src="./js/views/app.js"></script>
<script src="./js/views/login_view.js"></script>
</body>
Error: Uncaught ReferenceError: Backbone is not defined
Any help ?

Your router.js file may be using backbone object which is not included yet.
So move inclusion of router.js after backbone.js
<script src="./js/jquery-latest.js"></script>
<script src="./js/jquery-ui-1.10.4.custom.js"></script>
<script src="./js/underscore-min.js"></script>
<script src="./js/backbone-min.js"></script>
<script src="./js/router/router.js"></script>
<script src="./js/views/app.js"></script>
<script src="./js/views/login_view.js"></script>

<script src="./js/router/router.js"></script>
Is this an external js file that contains the backbone routes. If that's the case then it should be placed after the backbone-min.js.

Related

Uncaught TypeError: $(...).tempusDominus is not a function

<!-- Vendor JS Files -->
<script src="../assets/vendor/jquery/jquery-3.6.0.js"></script>
<script src="../assets/vendor/bootstrap/js/bootstrap.bundle.min.js"></script>
<script src="../assets/vendor/datatables/datatables.js"></script>
<script src="../assets/vendor/apexcharts/apexcharts.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-select/1.14.0-beta2/js/bootstrap-select.min.js" integrity="sha512-FHZVRMUW9FsXobt+ONiix6Z0tIkxvQfxtCSirkKc5Sb4TKHmqq1dZa8DphF0XqKb3ldLu/wgMa8mT6uXiLlRlw==" crossorigin="anonymous" referrerpolicy="no-referrer"></script>
<script src="../assets/vendor/chart.js/chart.min.js"></script>
<script src="../assets/vendor/echarts/echarts.min.js"></script>
<script src="../assets/vendor/quill/quill.min.js"></script>
<script src="../assets/vendor/simple-datatables/simple-datatables.js"></script>
<script src="../assets/vendor/tinymce/tinymce.min.js"></script>
<script src="../assets/vendor/php-email-form/validate.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/tempus-dominus/6.0.0-beta2/js/tempus-dominus.js"></script>
<script src="https://kit.fontawesome.com/a98bc9d553.js" crossorigin="anonymous"></script>
<!-- Template Main JS File -->
<script src="../assets/js/main.js"></script>
What's wrong with my script init? already tried, it always give me Uncaught TypeError: $(...).tempusDominus is not a function eventhough the Jquery already at the top
This page outlines using the picker with jQuery. The jQuery-provider.js file must be included after the main picker code. jQuery is no longer a requirement and is here for backwards compatibility.
Forgot to include the JSProvider.js

Backbone is not defined online but work on localhost

This code work on localhost but it's not working online
I get this Error online:
Uncaught ReferenceError: Backbone is not defined
Code:
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
<script src="assets/js/libraries/jquery.base64.min.js"></script>
<script src="assets/js/libraries/jQueryRotateCompressed.js"></script>
<script src="assets/js/libraries/filereader.js"></script>
<script src="assets/js/libraries/modernizr.js"></script>
<script src="assets/js/libraries/html5slider.js"></script>
<script src="assets/js/libraries/underscore-min.js"></script>
<script src="assets/js/libraries/backbone-min.js"></script>
<script src="assets/js/libraries/backbone.nopersistence.js"></script>
<script src="assets/js/share.js"></script>
<script src="assets/js/mfanimated.js"></script>
<script src="assets/js/models.js"></script>
<script src="assets/js/ui.js"></script>
<script src="assets/js/startup.js"></script>
Error: Uncaught ReferenceError: Backbone is not defined
I Check the network tab and I see that they are not loaded correctly.
The probleme is solved.
Thanks.

Meteor scaffolding for HTML templates

I've just bought an HTML template and I'm trying to work with it with Meteor.js in an iron scaffold. But I don't know where to place the js inide the template. This template is using this js files:
<script src="js/jquery.min.js"></script>
<script src="js/bootstrap.min.js"></script>
<script src="js/flickr.js"></script>
<script src="js/flexslider.min.js"></script>
<script src="js/lightbox.min.js"></script>
<script src="js/masonry.min.js"></script>
<script src="js/twitterfetcher.min.js"></script>
<script src="js/spectragram.min.js"></script>
<script src="js/ytplayer.min.js"></script>
<script src="js/countdown.min.js"></script>
<script src="js/smooth-scroll.min.js"></script>
<script src="js/scparallax.js"></script>
<script src="js/scripts.js"></script>
This is my scaffold.
enter image description here
Could anyone knows where do I need to put my js files?
Those are the errors I'm getting:
Uncaught SyntaxError: Unexpected token <
Uncaught TypeError: $(...).tooltip is not a function

What is the correct order of loading AngularJS files?

I encountered a problem where my AngularJS webpages don't load properly sometimes. When this happens, the code in the corresponding controller does not run. It only happens rarely. I suspect that this could be due to the loading order of AngularJS files. Perhaps there are other possible causes. Please alert me if you can think of any. Below is my code showing the loading order of the html page;
<script src="lib/angular/angular.min.js"></script>
<script src="lib/angular/angular-route.min.js"></script>
<script src="js/app.js"></script>
<script src="js/services.js"></script>
<script src="js/controllers.js"></script>
<script src="js/filters.js"></script>
<script src="js/directives.js"></script>
<script src="vendor/dialogs.min.js" type="text/javascript"></script>
<script src="lib/angular/angular-sanitize.min.js"></script>
<script src="vendor/angular-translate.min.js"></script>
<link href="vendor/dialogs.css" rel="stylesheet">
Is there anything wrong?
First Load angular library:
<script src="lib/angular/angular.min.js"></script>
<script src="lib/angular/angular-route.min.js"></script>
<script src="vendor/dialogs.min.js" type="text/javascript"></script>
<script src="lib/angular/angular-sanitize.min.js"></script>
<script src="vendor/angular-translate.min.js"></script>
After that load your controllers, services, filters, directives
<script src="js/services.js"></script>
<script src="js/controllers.js"></script>
<script src="js/filters.js"></script>
<script src="js/directives.js"></script>
Finally, now you can load your app init file
<script src="js/app.js"></script>
Although the order is correctly mentioned by Nitish,
you should consider using a script loading tools such as require js as mantaining the inter-dependency between libraries will get messy once you have a large no of files to include.

Uncaught Error: [$injector:modulerr] on AngularJS

In the beginning of my html I've declare my application:
<html lang="en" ng-app="MyAppModule">
and at the bottom I have include all the necessary files, the Chrome does not complain for any missing file:
<!-- Placed at the end of the document so the pages load faster -->
<script src="js/jquery-1.11.0.min.js"></script>
<script src="js/bootstrap.min.js"></script>
<script src="js/angular.min.js"></script>
<script src="js/angular-resource.min.js"></script>
<script src="js/angular-route.min.js"></script>
<script src="js/app.js"></script>
<script src="js/Controllers/EventController.js"></script>
<script src="js/Services/EventService.js"></script>
<script src="js/filters.js"></script>
Here is my application:
'use strict';
// Declare app level module which depends on filters, and services
var MyAppModule = angular.module('MyAppModule', ['ngResource']).config(function($routeProvider){
$routeProvider.when('/mybooks',{
templateUrl:'/templates/mybooks.html',
controller:'EventController'
}
);
});
But when I am trying to see the page there is a Uncaught Error: [$injector:modulerr] http://errors.angularjs.org/1.2.14/$injector/modulerr?p0=MyAppModule&p1=Errā€¦js.org%2F1.2.14%2F%24injector%2Funpr%3Fp0%3D%2524routeProvider%0A%20%20%20...<omitted>...2) on the browser. Any help? Am I missing something?
Try replacing this:
['ngResource']
With this:
['ngResource', 'ngRoute']
It looks like you're not injecting the route provider.

Categories

Resources