我有一个html表,它显示列客户名称、员工名称和事项,而在我的数据库中,我有id、date、client_name、staff、事项列。这不是问题所在。我想在click按钮上删除行,所以我只添加了一个列delete,其中包含id为"del"的按钮,是的,这个列在我的数据库中不存在。现在,我想删除表中的行以及使用Jquery单击相应按钮上的数据库。我该怎么做?这就是我迄今为止所尝试的
$(document).ready(function(){
$('#tableresult').on('click', '#del', (function(){
var row = $(this).attr('id');
$(#tableresult).removeRow(row);
});
});
n我的html-
<td class="delete_td"><button id="del" btn btn-danger>×</button></td>
这是我的html表格代码-
<table class="footable" data-filter="#filter" id="tableresult">
<thead>
<th>Client name</th>
<th>Staff name</th>
<th>Matter</th>
<th> Delete</th>
</thead>
<?php
include('db.php');
$sql=mysql_query("select * from newdata");
while($row=mysql_fetch_array($sql))
{
$id=$row['id'];
$clientname=$row['client_name'];
$staff=$row['staff'];
$matter=$row['matter'];
?>
<tr id="<?php echo $id; ?>" class="edit_tr">
<td class="edit_td" >
<span id="client_<?php echo $id; ?>" class="text"><?php echo $clientname; ?></span>
<input type="text" value="<?php echo $clientname; ?>" class="editbox" id="client_input_<?php echo $id; ?>" />
</td>
<td class="edit_td">
<span id="staff_<?php echo $id; ?>" class="text"><?php echo $staff; ?></span>
<input type="text" value="<?php echo $staff; ?>" class="editbox" id="staff_input_<?php echo $id; ?>"/>
</td>
<td class="edit_td">
<span id="matter_<?php echo $id; ?>" class="text"><?php echo $matter; ?></span>
<input type="text" value="<?php echo $matter; ?>" class="editbox" id="matter_input_<?php echo $id; ?>"/>
</td>
<td class="delete_td"><button id="del" btn btn-danger>×</button></td>
</tr>
<?php
}
?>
</tbody>
<tfoot class="hide-if-no-paging">
<th> </th>
<th>
<div class="pagination pagination-centered"></div>
</th>
<th> </th>
<th> </th>
</tfoot>
</table>
这是我的table_edit.js代码,看看这是否与相关
$(document).ready(function()
{
$(".edit_tr").click(function()
{
var ID=$(this).attr('id');
$("#client_"+ID).hide();
$("#staff_"+ID).hide();
$("#matter_"+ID).hide();
$("#client_input_"+ID).show();
$("#staff_input_"+ID).show();
$("#matter_input_"+ID).show();
}).change(function()
{
var ID=$(this).attr('id');
var client=$("#client_input_"+ID).val();
var staff=$("#staff_input_"+ID).val();
var matter=$("#matter_input_"+ID).val();
var dataString = 'id='+ ID +'&clientname='+client+'&staff='+staff+'&matter='+matter;
//$("#client_"+ID).html('<img src="load.gif" />'); // Loading image
if(client.length>0 && staff.length>0 && matter.length>0)
{
$.ajax({
type: "POST",
url: "table_edit_ajax.php",
data: dataString,
cache: false,
success: function(html)
{
$("#client_"+ID).html(client);
$("#staff_"+ID).html(staff);
$("#matter_"+ID).html(matter);
}
});
}
else
{
alert('enter something');
}
});
// Edit input box click action
$(".editbox").mouseup(function()
{
return false
});
// Outside click action
$(document).mouseup(function()
{
$(".editbox").hide();
$(".text").show();
});
});
试试这个
$("#del").click(function () {
var row = $(this).attr('temp_id');
$.ajax({
type: "GET",
url: 'http://yoursite_url/delete.php',
data: {id: row},
success: function (result) {
$('#row').remove();
}
});
});
像这个一样更改按钮
<button id="del" temp_id="<?php echo $id; ?>" class="btn btn-danger">×</button>
AND delete.php include 'config.php';
$id = $_GET['id'];
$sql = mysql_query("DELETE FROM TABLE_NAME WHERE id = '$id'");
您的js应该像一样
$(document).ready(function () {
$('#tableresult').on('click', '#del', (function () {
var row = $(this).attr('id');
$.ajax({
type: "GET",
url: 'http://yoursite_url/delete.php',
data: {id: row },
success: function (result) {
$('#'+row).remove();
}
});
});
});
和delete.php
include 'config.php' // DB Connection
$id = $_GET['id'];
$sql = mysql_query("DELETE FROM TABLE_NAME WHERE id = '$id'");