//
// config.js
//
requirejs.config({
baseUrl: '/static/',
paths: {
backbone: 'backbone/backbone',
bootstrap: 'bootstrap/js/bootstrap',
bootstrap_select: 'bootstrap-select/bootstrap-select',
c3: 'c3/c3',
d3: 'd3/d3',
datatables: 'datatables/datatables',
datatables_buttons: 'datatables-buttons/dataTables.buttons',
handlebars: 'handlebars/handlebars',
jquery: 'jquery/jquery',
jquery_match_height: 'jquery-match-height/jquery.matchHeight',
math: 'mathjs/math',
pace: 'pace/pace',
patternfly: 'patternfly/js/patternfly',
underscore: 'underscore/underscore',
text: 'text/text',
},
shim: {
backbone: {
deps: ['underscore', 'jquery'],
exports: 'Backbone',
},
bootstrap: {
deps: ['jquery'],
},
patternfly: {
deps: ['jquery', 'bootstrap'],
},
underscore: {
exports: '_'
},
bootstrap_select: {
deps: ['jquery', 'bootstrap'],
init: function($) {
'use strict';
$('select').selectpicker();
}
},
}
});
//
// view.js
//
define (function (require) {
'use strict';
// Vendor Dependencies
var $ = require(['jquery', 'bootstrap', 'patternfly', 'bootstrap_select']);
var _ = require('underscore');
var Backbone = require('backbone');
var Handlebars = require('handlebars');
// System Dependencies
var template = require('text!path/to/my/template.handlebars');
var myCollection = require('path/to/my/collection')
// View Definition
var MyView = Backbone.View.extend({
el: "#mytoolbar",
template: Handlebars.compile(template),
// Event triggerer for the user search box
events: {
'change #toolbar-search': function(e) {
Backbone.GlobalListener.trigger("change:search", $("#toolbar-search").value);
}
},
initialize: function(someobj) {
this.someobj = someobj;
this.someobj.fetch();
this.selectData = new myCollection();
this.selectData.fetch();
this.listenTo(this.someobj, 'sync', this.render);
this.listenTo(this.selectData, 'sync', this.render);
this.listenTo(this, 'render', this.post_render);
},
render: function() {
this.$el.html(
this.template({options: this.selectData.pluck('mymodelnamefield')})
);
this.trigger('render');
return this;
},
post_render: function() {
this.$el.find('.selectpicker').selectpicker(); // ERROR this.$el.find(...).selectpicker is not a function
}
});
return MyView;
});