2
I have this code:
db.transaction (function (tx) {
tx.executeSql(`SELECT * FROM cartoes WHERE usuario = ${0}`, [], function(tx, results){
for(var i=0; i<results.rows.length; i++) {
var nomeEmpresa = results.rows.item(i).empresa;
var nome = results.rows.item(i).nome;
var id = results.rows.item(i).id;
var d = new Date();
var capa = results.rows.item(i).img2 + '?time=' + d.getTime();
$(".listagem-cartoes").append(
`<div style="width: 100%; overflow-x: hidden;">
<div class="cartoes">
<div class="item-total">
<div class="col s12 m8 offset-m2 l6 offset-l3" style="width: 50%;">
<div class="card-panel grey lighten-5 z-depth-1">
<div class="row valign-wrapper foto" id = ${id}>
<div class="col s3 lista-cartoneira editar-cartao" style="padding-left: 0px;">
<img src="${results.rows.item(i).img2 + '?time=' + d.getTime()}" alt="" class="circle responsive-img foto" id=${id}>
</div>
<div class="col s9 lista-cartoneira">
<h1>${nomeEmpresa}</h1>
<h2>${nome}</h2>
</div>
</div>
</div>
</div>
</div>
<div class="col s12 m8 offset-m2 l6 offset-l3" style="width: 50%; float: right; margin-top: -136px;">
<div class="card-panel grey lighten-5 z-depth-1">
<div class="row valign-wrapper botoes">
<div class="atalhos-cartoneira col s3" style="background-color: #00b0ff;">
<i class="material-icons telefone" id=${id}>phone</i>
</div>
<div class="atalhos-cartoneira col s3" style="background-color: #ffb74d;">
<i class="material-icons email" id=${id}>email</i>
</div>
<div class="atalhos-cartoneira col s3 botao-localizacao" id=${id} style="background-color: #757575;">
<i class="material-icons localizacao" id=${id}>place</i>
</div>
<div class="atalhos-cartoneira col s3" style="background-color: #00BFA5;">
<i class="material-icons compartilhar" id=${id}>open_in_new</i>
</div>
</div>
</div>
</div>
</div>
</div>`
);
}
});
});
This code has the function to list all user cards.
Visually it looks like this:
(the second stayed that way because it has no image).
What I want to do is this..
I have in my bank, also, the address table. No card is required to have address. If not, I want to remove the location button(address) ONLY on the card that has no address, so it would look like this:
To do this, I make an appointment at the bank and check which cards have no address:
db.transaction (function (tx) {
tx.executeSql(`SELECT * FROM enderecos WHERE cartao = ${id}`, [], function(tx, results){
for(var i=0; i<results.rows.length; i++) {
var endereço = results.rows.item(i).endereco;
if(endereco == ""){
//AQUI É ONDE MORA O PROBLEMA. EU QUERO ESCONDER/REMOVER O BOTÃO SOMENTE NO CARTÃO QUE NÃO TEM ENDEREÇO. COMO PODERIA FAZER ISSO?
}
}
});
});
The last code is where the problem lives... I want to hide the button only on the card that has no address. How could I do this?
This is the div that was inserted through the append that I need to hide/remove:
<div class="atalhos-cartoneira col s3 botao-localizacao" id=${id} style="background-color: #757575;">
<i class="material-icons localizacao" id=${id}>place</i>