I would like to incorporate a link in my table for a delete button. This will then - onclick - delete from my db depending on the ID.
I have searched through stack overflow with no prevail. A point in the right direction would be great (links, code suggestions etc etc..).
The HTML:
<h5 class="tabletext"><a href="#">View Markers</a></h5>
<form action="" method="post">
<table class="table table-bordered">
<thead>
<tr>
<th data-field="id">ID</th>
<th data-field="type">Type</th>
<th data-field="area">Area</th>
<th data-field="area">Weight in lbs</th>
<th data-field="area">Length in cm</th>
<th data-field="area">Latitude</th>
<th data-field="area">Longitude</th>
<th data-field="area">DELETE</th>
</tr>
</thead>
</table>
</form>
The .js:
$.ajax({
type: 'GET',
dataType: "json",
url: "rest/rest/api.php/markerss",
success: showMarkerTable,
error: showError
});
function showMarkerTable(responseData) {
var items = [];
$.each(responseData.MARKERS, function(key, val){
items.push("<tr>");
items.push("<td id=''"+key+"''>"+val.id+"</td>");
items.push("<td id=''"+key+"''>"+val.area+"</td>");
items.push("<td id=''"+key+"''>"+val.type+"</td>");
items.push("<td id=''"+key+"''>"+val.weight+"</td>");
items.push("<td id=''"+key+"''>"+val.length+"</td>");
items.push("<td id=''"+key+"''>"+val.lat+"</td>");
items.push("<td id=''"+key+"''>"+val.lng+"</td>");
//The delete button here
items.push("<td id=''"+key+"''>"+val.delete+"</td>");
items.push("</tr>");
});
$("<tbody/>", {html: items.join("")}).appendTo("table");
}
function showError(){
alert("Sorry, there was a problem!");
}
The php using SLIM framework to retrieve the data:
function getTable() {
$sql="select * FROM markers ORDER BY id";
try{
$db = getConnection();
$stmt = $db->query($sql);
$markers = $stmt->fetchAll(PDO::FETCH_OBJ);
$db = null;
responseJson('{"MARKERS":'.json_encode($markers).'}',200);
}
catch(PDOException $e){
responseJson('{"error":{"text":'.$e->getMessage().'}}',500);
}
}