Databases
StackOverflow2013
Postsdbo
POBackbonejs / Underscorejs with RequireJS - Views not reloading Jquery after render
 

Note that there are some explanatory texts on larger screens.

plurals
  1. POBackbonejs / Underscorejs with RequireJS - Views not reloading Jquery after render
    primarykey
    data
    text
    <p>It's my first project using <strong>Backbone/Underscore</strong> and <strong>RequireJS</strong>. I have a "parent view" named <em>Home</em> and a child view named <em>Sidebar</em>. I got that the parent view loaded with the content of the child templates (static content for now, without models), but the problem is that jquery and scripts.js (home made file that have all the calls to jquery functions) not loading properly. Seems like jquery loads at the bigining, but not reloads or not refresh when the Home view's rendered. I'm going to show the code to try to explaining it better.</p> <p>The two files that I want to load are <em>jquery</em> and <em>scripts.js</em>. Jquery is the library and I think that it loads (I don't know how test it). The second one is the scripts.js, file where I call the functions of jquery (.animate(...), .css(...), etc.).</p> <p><strong>Home view (Home.js)</strong> </p> <pre><code>define(function (require) { "use strict"; var $ = require('jquery'), Scripts = require('scripts'), Backbone = require('backbone.min'), tpl = require('text!tpl/Home.html'), Sidebar = require('app/views/Sidebar'), template = _.template(tpl); return Backbone.View.extend({ el: $("body"), initialize : function() { this.sidebar = new Sidebar(), this.on('render', this.onRender); }, render : function () { this.$el.html(template()); return this.trigger('render'); }, onRender : function() { this.sidebar.setElement('aside').render(); } }); }); </code></pre> <p><strong>Sidebar View (Sidebar.js)</strong></p> <pre><code>define(function (require) { "use strict"; var $ = require('jquery'), Scripts = require('scripts'), _ = require('underscore.min'), Backbone = require('backbone.min'), tpl = require('text!tpl/Sidebar.html'), template = _.template(tpl); return Backbone.View.extend({ el : $("#sidebar"), render: function () { this.$el.html(template()); } }); }); </code></pre> <p>Finally, this is the code from my RequireJS configuration file (app.js). I've put that backbone.min depends on jquery, underscore and scripts to force to the view to load the scripts.js file.</p> <p><strong>app.js</strong></p> <pre><code>require.config({ baseUrl: 'js/lib', paths: { app: '../app', tpl: '../tpl' }, map: { '*': { 'app/app': 'app/app' } }, shim: { 'tablesorter.min' : ['jquery.min'], 'tablesorter.widgets.min' : ['jquery.min', 'tablesorter.min'], 'scripts' : ['jquery.min', 'tablesorter.min', 'tablesorter.widgets.min', 'json2'], 'backbone.min' : { deps: ['underscore.min', 'jquery.min', 'scripts'], exports: 'Backbone' }, 'underscore.min': { exports: '_' } } }); require([ "jquery.min", "backbone.min", "app/router", "scripts" ], function( $, Backbone, Router, Scripts ){ var router = new Router(); Backbone.history.start(); }); </code></pre> <p><strong>EDIT:</strong></p> <p>I've a <em>/tpl</em> directory where I put all the template files of the views. To see the example I've upload a <a href="http://jordillobet.es/versio_bb/" rel="nofollow">lite version of the project</a> </p> <p>Sry for the explanation... I've tried to explain the much better as possible :)</p>
    singulars
    1. PO
      singulars
      1. PTAnswer
    1. This table or related slice is empty.
    1. PTQuestion
    1. USnewpatriks
    1. USnewpatriks
    plurals
    1. This table or related slice is empty.
    1. This table or related slice is empty.
    1. This table or related slice is empty.
    1. PO
      singulars
      1. PTAnswer
    1. VO
      singulars
      1. POBackbonejs / Underscorejs with RequireJS - Views not reloading Jquery after render
      1. USTanmay
      1. VTFavorite
    1. COShow your script sources on your html pages. They may just be conflicting.
      singulars
      1. POBackbonejs / Underscorejs with RequireJS - Views not reloading Jquery after render
      1. USJon La Marr
    2. COSry @JonLaMarr, I've uploaded a lite version of the project in [this url](http://jordillobet.es/versio_bb/index.html)
      singulars
      1. POBackbonejs / Underscorejs with RequireJS - Views not reloading Jquery after render
      1. USnewpatriks
    3. CO'jquery' vs 'jquery.min' ?
      singulars
      1. POBackbonejs / Underscorejs with RequireJS - Views not reloading Jquery after render
      1. USGijsjanB
 

Querying!

 
Guidance
A row detail

Detail views are divided into sections. All the information in the data section comes from columns in the selected row. The other sections display data from other, related rows.

Related data can be related in a to-one or a to-many fashion. Captions of data related in a to-many fashion link to a list view showing a filtered view of the table.

Try moving around until you find a non-empty to-many entry and click on the label to get to one. You can move back to the root by clicking on the database name in the header.

SQuiL has stopped working due to an internal error.

If you are curious you may find further information in the browser console, which is accessible through the devtools (F12).

Reload