Использование Firebase для вывода списка и сортировки записей по возрастанию и наименьшего размера и печати в теле таблицы HTML - PullRequest
0 голосов
/ 15 ноября 2018

У меня есть список игроков и их накопленные выигрыши в огненной базе. Каждая запись будет добавлена ​​от наименьшего к наибольшему.

<table id="toptenwinners" class="table table-hover table-sm">
<thead>
<tr>
<th>Rank</th>
<th>Player</th>
<th>Earnings</th>
<th>Tokens</th>
</tr>
</thead>
<tbody>
<tr>  <-- start of insert
<th scope="row">1</th>  <-- number generated after sort
<td>John Q Public</td> <-- from "player" in firebase
<td>552,133</td>       <-- from "total earnings" in firebase
<td>1,212,808</td>     <-- from "tokens" in firebase
</tr> <-- end of insert
 ..next record

Написанная подпрограмма, похоже, не подходит для этого простого приложения.

dataRef.on('player',function(toptenwinners){

var toptenwinnersHTML = "";

toptenwinners.forEach(function(firebaseOrderReference){
var toptenwinners = dataRef.val();
console.log(toptenwinners); 
var tableofwinners = 

<tr>
<th scope="row">1</th>  
<td>' + player + '</td> 
<td>' + t_earnings + '</td>       
<td>' + t_token + '</td>     
</tr>;

toptenwinnersHTML = toptenwinnersHTML + tableofwinners;
});

$('#toptentable').html(toptenwinnersHTML);
});

Мне интересно, есть ли более простой способ (с использованием jquery) перечислить всех «игроков» в БД, их доходы и токены в чистом виде. Добавьте способ сортировки от наивысших токенов (t_tokens) к наименьшему, затем пронумеруйте каждую «строку» (т. Е. 1, 2, 3, 4 ..) на основе сортировки.

Sample HTML Output:
Rank Name       Earnings Tokens
1    Spongebob  55,222   1,234,555
2    DarthVadar 88,010   555,213
3    PacMan     12,123   120,111

enter image description here

1 Ответ

0 голосов
/ 16 ноября 2018

Грустно, как вопросы устаревают здесь. Во всяком случае, понял это. Хитрость заключалась в том, чтобы использовать функцию data.ref (). Once для отображения всего содержимого БД, а затем корректно передавать результаты (на каждой итерации) в формат HTML-таблицы.

работал как шарм ..

function listthechamps() {

let y = 0
$("#tableChampion").empty();

var database = firebase.database();
database.ref().once('value', function (snapshot) {
if (snapshot.exists()) {
var content = '';
snapshot.forEach(function (data) {
y++
var val = data.val();
content += '<tr>';
content += '<td>' + y + '</td>';
content += '<td>' + val.player + '</td>';
content += '<td>' + val.t_earnings + '</td>';
content += '<td>' + val.t_token + '</td>';
content += '</tr>';
});
$('#tableChampion').append(content);
}
});
}
Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...