JSFiddle - React, Tailwind, and code Playground
HTML
<script src="http://cdnjs.cloudflare.com/ajax/libs/underscore.js/1.4.4/underscore-min.js"></script>
<script src="http://cdnjs.cloudflare.com/ajax/libs/backbone.js/1.0.0/backbone-min.js"></script>
<link rel="stylesheet" href="//netdna.bootstrapcdn.com/twitter-bootstrap/2.3.2/css/bootstrap-combined.min.css">
<script src="https://rawgithub.com/derickbailey/backbone.memento/master/backbone.memento.min.js"></script>
<script src="https://rawgithub.com/derickbailey/backbone.marionette/master/lib/backbone.marionette.js"></script>
<script src="http://craigsworks.com/projects/qtip2/packages/nightly/jquery.qtip.js"></script>
<link rel="stylesheet" href="http://craigsworks.com/projects/qtip2/packages/nightly/jquery.qtip.css">
<script id="my-template" type="text/template">
<tr>
<td class="span2"><%= foo%></td>
<td class="span6"><%=bar%></td>
<td class="span2"><%=baz%></td>
</tr>
</script>
JavaScript
$(function () {
var MyModel = Backbone.Model.extend();
var MyCollection = Backbone.Collection.extend({
model: MyModel
});
var MyItemView = Backbone.Marionette.ItemView.extend({
template: "#my-template"
});
var MyCollectionView = Backbone.Marionette.CollectionView.extend({
tagName: "table",
className: "table",
getItemView : function(item){
/*expected item to be a modal instance, but found undefined*/
console.log(item);
/*
was plannig to do this:
if(item.get("id") === 1){
retrun SomeCustomItemView;
}else{
return MyItemView;
}
//but item is returned as undefined
*/
return MyItemView
},
onClose: function () {
console.log("view closed");
}
});
var myCollectionInstance = new MyCollection();
var myModelInstance1 = new MyModel({
id : 1,
foo: "foo",
bar: "bar",
baz: "baz"
});
var myModelInstance2 = new MyModel({
id: 2,
foo: "foo2",
bar: "bar2",
baz: "baz2"
});
myCollectionInstance.add(myModelInstance1);
myCollectionInstance.add(myModelInstance2);
myCollectionInstance.add(myModelInstance3);
var myCollectionViewInstance = new MyCollectionView({
collection: myCollectionInstance
});
$("body").append(myCollectionViewInstance.render().$el);
});