Why are some rows disappearing when I sort or filter listjs table

Question

I'm writing a webapp that reads from a geojson file and also out of Google Fusion Tables.

The geojson works fine in the app, which adds each item to a map and also as a row in a table for searching, sorting and filtering. But I'm having a strange issue that I'm having trouble diagnosing, where the rows get added, but I think the listjs components aren't functioning properly.

I'm stuck, and need some help!

Here's the the page: http://alexgleith.github.io/SSSPros/

Here's the code: https://github.com/alexgleith/SSSPros

Look at lines 144 to 230 in assets/js/app.js, which sets up the layer, sets up the table, and later, does a request to Google Fusion Tables.

Please ask questions if I haven't been clear enough.

To summarise, in the example webapp, there are six items on the map and in the table. IF you sort or filter the table, two of them disappear. I don't know why.

Answer 1

See line 352 where the list is created after the jQuery ajaxStop handler is registered. This should wait until after the AJAX calls have finished to create the list, but your fusiontables features are not being properly added to the list. If you manually run the following commands in your JavaScript console after the page has loaded, you will see the list is created and sorted properly:

featureList = new List("features", {valueNames: ["feature-name"]});
featureList.sort("feature-name", {order:"asc"});