I am facing a series of problems and doubts with ajax! Have the following function that updates the data and list in a table:
function atualiza(){
$.ajax({
dataType: 'json',
url: 'get_enderecos.php',
success: function(data){
for(var i=0; data.length>i;i++){
$('#enderecos').append('<tr><td>'+data[i].sequencia+'</td><td>'
+data[i].cep+'</td><td>'+data[i].endereco+
'</td><td>'+data[i].bairro+'</td><td>'+data[i].cidade+
'</td><td>'+data[i].estado+
'</td><td class="actions col-xs-2 col-sm-2 col-md-2 col-lg-2" align="center">'+
<button class="btn btn-danger" id="teste" type="button">Alterar Endereço</button>);
}
}
});
}
PHP:
<?php
require_once('acessabanco.php');
$objDb = new db();
$link = $objDb->conecta_banco();
$sql = " SELECT sequencia, cep, endereco, bairro, cidade, estado FROM ENDERECOS";
$lista = mysqli_query($link, $sql);
while($resultado = mysqli_fetch_assoc($lista)){
$vetor[] = array_map('utf8_encode', $resultado);
}
echo json_encode($vetor);
?>
HTML:
<table class="table table-striped table-bordered table-hover table-condensed table-responsive">
<thead>
<tr>
<th> Código </th>
<th> CEP </th>
<th> Endereço </th>
<th> Bairro </th>
<th> Cidade </th>
<th> Estado </th>
<th> Alterar </th>
</tr>
</thead>
<tbody id="enderecos">
</tobody>
</table>
I think this is not the best way (it seems gambiarra) to list the data in a table, for example: the button I put, I can not access it, perhaps because it is being declared in a JS function. Is there a proper way to do this?