Подождите, пока bootstrapTable полностью загрузится, прежде чем что-то делать

Question

У меня есть javascript based bootstrapTable, который динамически генерирует таблицу и данные.

У меня возникла проблема с попыткой применить некоторые стили и стили CSS к некоторым из td, которые сгенерированы в this question. Я понял, что, по-моему, моя проблема в том, что таблица не полностью загружена, что приводит к тому, что мой код не работает. Он отлично работает, если я вручную напишу код таблицы, но не динамически.

Я попытался с помощью load событие ждать таблицы для загрузки, но это, кажется, не работает

$table.load(function() { 
// do something 
}); 

Что JQuery мне нужно сделать для того, чтобы ждать, пока $table быть полностью загружен, прежде чем я сделать что-то ?

Javascript таблица

var $table = $('#table-javascript').bootstrapTable({ 
    method: 'get', 
    url: 'bootstrap_database.php', 
    height: 3849, 
    cache: false, 
    striped: true, 
    pagination: true, 
    search: true, 
    pageSize: 100, 
    pageList: [100, 200, 600, 1000], 
    minimumCountColumns: 2, 
    clickToSelect: true, 
    columns: [{ 
     field: 'ID', 
     title: 'ID', 
     align: 'center', 
     visible: false 
    },{ 
     field: 'backlink', 
     title: 'Backlink', 
     align: 'left', 
     width: '20' 
    },{ 
     field: 'indexed', 
     title: 'PI', 
     align: 'center', 
     width: '20', 
    },{ 
     field: 'dindexed', 
     title: 'DI', 
     align: 'center', 
     width: '20', 
    },{ 
     field: 'moz', 
     title: 'MOZ', 
     align: 'center', 
     width: '20', 
    },{ 
     field: 'email', 
     title: 'EM', 
     align: 'center', 
     width: '20' 
    },{ 
     field: 'social', 
     title: 'SOC+', 
     align: 'center', 
     width: '20' 
    },{ 
     field: 'whois', 
     title: 'WHO', 
     align: 'center', 
     width: '20' 
    },{ 
     field: 'notes', 
     title: 'NT', 
     align: 'center', 
     width: '20' 
    },{ 
     field: 'removed', 
     title: 'RM', 
     align: 'center', 
     width: '20' 
    },{ 
     field: 'import_label', 
     title: 'SR', 
     align: 'center', 
     width: '20' 
    },{ 
     field: 'important', 
     title: 'IM', 
     align: 'center', 
     width: '20' 
    },{ 
     field: 'refresh', 
     title: 'RF', 
     align: 'center', 
     width: '20', 
     class: 'refreshstats' 
    },{ 
     field: 'exempt', 
     title: 'EX', 
     align: 'center', 
     width: '20', 
    },{ 
     field: 'spammy', 
     title: 'SP', 
     align: 'center', 
     width: '20', 
    }] 
}); 

Answer 1

Есть много событий, вы можете переопределить:

onAll: function (name, args) { 
     return false; 
    }, 
    onClickRow: function (item, $element) { 
     return false; 
    }, 
    onDblClickRow: function (item, $element) { 
     return false; 
    }, 
    onSort: function (name, order) { 
     return false; 
    }, 
    onCheck: function (row) { 
     return false; 
    }, 
    onUncheck: function (row) { 
     return false; 
    }, 
    onCheckAll: function() { 
     return false; 
    }, 
    onUncheckAll: function() { 
     return false; 
    }, 
    onLoadSuccess: function (data) { 
     return false; 
    }, 
    onLoadError: function (status) { 
     return false; 
    }, 
    onColumnSwitch: function (field, checked) { 
     return false; 
    }, 
    onPageChange: function (number, size) { 
     return false; 
    }, 
    onSearch: function (text) { 
     return false; 
    }, 
    onToggle: function (cardView) { 
     return false; 
    }, 
    onPreBody: function (data) { 
     return false; 
    }, 
    onPostBody: function() { 
     return false; 
    }, 
    onPostHeader: function() { 
     return false; 
    }, 
    onPreRows: function() { 
     return false; 
    }, 
    onPostRows: function() { 
     return false; 
    } 

не зная ничего о том, как этот плагин работает, я бы предложил попробовать onLoadSuccess или onPostRows:

var $table = $('#table-javascript').bootstrapTable({ 
    method: 'get', 
    ... 
    onLoadSuccess: function() { 
     // do something 
    }, 
    ... 
}); 

Answer 2

Попробуйте

.on('all.bs.table', function (e, name, args) { 
       console.log('load-success'); 
      }) 

Конечно, прежде чем дальше, иметь свой bootstrapTable вызов, как это было http://wenzhixin.net.cn/p/bootstrap-table/docs/examples.html#table-events

Answer 3

Глядя на документы существует onLoadSuccess Событие, которое срабатывает после успешной загрузки данных.

var $table = $('#table-javascript').bootstrapTable({ 
    method: 'get', 
    url: 'bootstrap_database.php', 
    height: 3849, 
    cache: false, 
    striped: true, 
    pagination: true, 
    search: true, 
    pageSize: 100, 
    pageList: [100, 200, 600, 1000], 
    minimumCountColumns: 2, 
    clickToSelect: true, 
    onLoadSuccess: function(){ 
     //do something after data has loaded 
    }, 
    ....