Wie und wo werden JQueries initialisiert, die in der Backbone-Ansicht datierbar sind?
Meine HTML-Vorlage sieht so aus:
<script type="text/template" id="players-template">
<table id="example" class="table table-striped table-bordered table-condensed table-hover">
<thead>
<tr>
<th>Name</th>
<th>group</th>
<th></th>
</tr>
</thead>
<tbody id="playersTable"></tbody>
</table>
</script>
<script type="text/template" id="player-list-item-template">
<td><@= name @></td>
<td>
<@ _.each(hroups, function(group) { @>
<@= group.role @>
<@ }); @>
</td>
</script>
Meine Backbone-Ansicht ist wie folgt:
playerView = Backbone.View.extend({
template: _.template( $("#player-template").html() ),
initialize: function ()
if(this.collection){
this.collection.fetch();
},
render: function () {
this.$el.html( this.template );
this.collection.each(function(player) {
var itemView = new app.PlayerListItemView({ model: player });
itemView.render();
this.$el.find('#playersTable').append(itemView.$el);
},this
});
// view to generate each player for list of players
PlayerListItemView = Backbone.View.extend({
template: _.template($('#player-list-item-template').html()),
tagName: "tr",
render: function (eventName) {
this.$el.html( this.template(this.model.toJSON()) );
}
});
Der obige Code funktioniert einwandfrei. Jetzt möchte ich jquery datatable plugin mit Bootstrap-Unterstützung anwenden. Details finden Sie hier:http://www.datatables.net/blog/Twitter_Bootstrap_2 Also habe ich die Zeile im Render hinzugefügt als:
render: function () {
this.$el.html( this.template );
this.collection.each(function(player) {
var itemView = new app.PlayerListItemView({ model: player });
itemView.render();
this.$el.find('#playersTable').append(itemView.$el);
$('#example').dataTable( {
console.log('datatable');
"sDom": "<'row'<'span6'l><'span6'f>r>t<'row'<'span6'i> <'span6'p>>",
"sPaginationType": "bootstrap",
"oLanguage": {
"sLengthMenu": "_MENU_ records per page"
},
"aoColumnDefs": [
{ 'bSortable': false, 'aTargets': [ 2 ] }
]
} );
},this);
},
Jetzt wird die jquery-Datentabelle nicht initialisiert. Sie zeigen nur den normalen Tisch an.
Wo soll ich die Tabelle initialisieren, um jquery datatable anzuwenden?Sie arbeiteten perfekt ohne Rückgrat.