Tablesorter не загружен динамически сгенерированным контентом

Question

Я пытаюсь загрузить jQuery tablesorter в настраиваемом infowindow, создаваемом cartodb.js. Идея заключается в том, что когда я нажимаю точку данных на карте, откроется окно с информацией, динамически загружая данные из базы данных. Хотя информация загружается правильно и отображается как обычная таблица, tablesorter не загружается.

Соответствующий код:

<script> 
$(document).ready(function() 
{ 
    $("#bewohner").tablesorter(); 
} 
); 
</script> 

<script type="infowindow/html" id="infowindow_template"> 
    <div class="infowindow-custom"> 
    <a href="#close" class="cartodb-tooltip-close-button close">x</a> 
    <div class="cartodb-tooltip-content-wrapper"> 
     <div class="cartodb-tooltip-content" style="padding:2px"> 
     <div id="strasse"></div> 
     <table id="bewohner" class='tablesorter table table-condensed'> 
      <thead> 
       <tr> 
        <th> 
        <th>Familienname 
        <th>Vorname 
        <th>Beruf</th> 
        <th>Etage</th> 
        <th>Tel.</th> 
       </tr> 
      </thead> 
      <tbody> 
      </tbody> 
     </table> 
     </div> 
    </div> 
    <div class="cartodb-tooltip-container"></div> 
    </div> 
</script> 

....

cartodb.createLayer(map, layerUrl, layerOptions) 
    .addTo(map) 
    .on('done', function(layer) { 
    var infowindow = layer.getSubLayer(0).infowindow 
     infowindow.set('template', function(data) { 
     var clickPosLatLng = this.model.get('latlng'); 
     var fields = this.model.get('content').fields; 
    if (fields && fields[0].type !== 'loading') { 
     var obj = _.find(fields, function(obj) { 
     return obj.title == 'strasse_original' 
     }).value 
       } // end test of status     
     $.get("http://******.cartodb.com/api/v1/sql?q=select * from vauban_1 where strasse_original= '" + obj + "' ORDER BY etage, familienname ASC", function(data) { 
     $('#strasse').append("<h4>" + data.rows[0].strasse_heute + "/" + data.rows[0].strasse_original +"</h4>"); 
      for (var i = 0; i < data.total_rows; i++) { 
       $('#bewohner tbody').append("<tr><td>" + data.rows[i].zusatz + "<td>" + data.rows[i].familienname + "<td>" + data.rows[i].vorname + "<td>" + data.rows[i].beruf + "<td>" + data.rows[i].etage + "<td>" + data.rows[i].telefon + "</td></tr>"); 
       } 
     }); 
     return $('#infowindow_template').html(); 
     }); 
    }) 

Кажется, что я как-то, чтобы вызвать TableSorter каждый раз, когда InfoWindow загружается, но я не знаю, как ,

Answer 1

Я звонил для tablesorter был неправильно размещен, так как он должен быть помещен внутри функции, которая обновляет infowindow. Таким образом, рабочая версия функции:

cartodb.createLayer(map, layerUrl, layerOptions) 
.addTo(map) 
.on('done', function(layer) { 
var infowindow = layer.getSubLayer(0).infowindow 
    infowindow.set('template', function(data) { 
    var clickPosLatLng = this.model.get('latlng'); 
    var fields = this.model.get('content').fields; 
if (fields && fields[0].type !== 'loading') { 
    var obj = _.find(fields, function(obj) { 
    return obj.title == 'strasse_original' 
    }).value 
      } // end test of status     
    $.get("http://******.cartodb.com/api/v1/sql?q=select * from vauban_1 where strasse_original= '" + obj + "' ORDER BY etage, familienname ASC", function(data) { 
    $('#strasse').append("<h4>" + data.rows[0].strasse_heute + "/" + data.rows[0].strasse_original +"</h4>"); 
     for (var i = 0; i < data.total_rows; i++) { 
      $('#bewohner tbody').append("<tr><td>" + data.rows[i].zusatz + "<td>" + data.rows[i].familienname + "<td>" + data.rows[i].vorname + "<td>" + data.rows[i].beruf + "<td>" + data.rows[i].etage + "<td>" + data.rows[i].telefon + "</td></tr>"); 
      } 
     $("#bewohner").tablesorter(); 
    }); 
    return $('#infowindow_template').html(); 
    }); 
})