I am using the Firebase database in my project. The problem is that when I want to save an X user with an X punctuation, it shows posters of all the users of the database, when it should show a single poster announcing the user and his score. If the user exists, it loads the same. In addition, it shows posters of successful loading and at the same time of failure that I have defined. What am I failing?
//Busca la referencia Scores, sino, la crea y busca ramas y las imprime en la consola
function buscar() {
$("#scoreData").html("<div class='preloader-wrapper small active'><div class='spinner-layer spinner-green-only'><div class='circle-clipper left'><div class='circle'></div></div><div class='gap-patch'><div class='circle'></div></div><div class='circle-clipper right'><div class='circle'></div></div></div></div>");
//URl de las scores
var qn = firebase.database().ref('Scores/');
//buscamos scores
qn.once('value', function (scores) {
$("#scoreData").html("");
scores.forEach(function (score) {
var var_score = score.val();
var addToTable = "<tr><td>" + var_score.Usuario + "</td><td>" + var_score.Puntuación + "</td></tr>";
$("#scoreData").append(addToTable);
console.log(var_score);
});
});
}
//Guarda un Usuario con su puntuacion a la base de datos de firebase y luego levanta la lista de ramas en la referencia
function guardar() {
var scoreData = {
Usuario: $("#Usuario").val(),
Puntuación: $("#Puntuación").val(),
};
var refer = firebase.database().ref('Scores/');
//Recuperar los datos y comparar con el input, no esta funcionando
refer.orderByChild("Usuario").on("child_added", function(snapshot) {
if (snapshot.val().Usuario == scoreData.Usuario) {
console.log("No se pudo guardar");
//Cartel flotante
Materialize.toast('Ya existe el usuario ' + scoreData.Usuario+ ". Intente con otro nombre.", 5000, 'rounded');
} else {
// Get a key for a new Post.
var scoreKey = firebase.database().ref().child('Scores').push().key;
// Write the new post's data simultaneously in the posts list and the user's post list.
var updates = {};
updates['/Scores/' + scoreKey] = scoreData;
firebase.database().ref().update(updates);
buscar();
console.log("Guardando");
//cartel flotante para anunciar exitosa carga
Materialize.toast('Puntuación de '+ scoreData.Puntuación + ' agregada con éxito para ' + scoreData.Usuario, 5000, 'rounded');
}
});
}
buscar();
HTML
<div class="row">
<form class="col s4">
<div class="row">
<div class="input-field col s6">
<i class="material-icons prefix">account_circle</i>
<input id="Usuario" type="text" class="validate">
<label for="icon_prefix">Usuario</label>
</div>
</div>
</form>
</div>
<div class="row">
<form class="col s4">
<div class="row">
<div class="input-field col s6">
<i class="material-icons prefix">account_circle</i>
<input id="Puntuación" type="text" class="validate">
<label for="icon_prefix">Puntuación</label>
</div>
</div>
</form>
</div>
<div style="text-align:center">
<a class="waves-effect waves-light btn" onclick="guardar()">ENVIAR</a>
</div>
<table>
<thead>
<tr>
<th data-field='id'>Usuario</th>
<th data-field='name'>Puntuación</th>
</tr>
</thead>
<tbody id="scoreData" style="text-align:center"></tbody>
</table>