How can I access an URL using AJAX, receive no response, but just manipulate HTML?
I don't know if it's better used with AJAX (tell me, otherwise) but here is my problem:
Assuming i'm using Zend Framework, I hav开发者_开发知识库e a table with several registries from a database with a delete button on each row. That's like this
[...]
<tbody>
<?php foreach ($row as $reg) { ?>
<tr <?php if ($reg['value'] < 0) { echo "class='error'"; } ?>>
<td><?php echo $reg['creditor'] ?></td>
<td><?php echo $reg['debtor'] ?></td>
<td><?php echo $reg['reason'] ?></td>
<td>R$ <?php echo number_format(abs($reg['value']), 2, ',', ' ')?></td>
<td><a href="#" id="<?php echo $reg['id']; ?>" class="delete"><img src="http://192.168.0.102/libraries/css/blueprint/plugins/buttons/icons/cross.png" alt=""/></a></td>
</tr>
<?php } ?>
</tbody>
[...]
I would like to .fadeOut()
and delete (through the link history/delete/id/ROW_ID ) a table row when clicked in the respective delete button.
My deleteAction() has no render. It really shouldn't have one, it just deletes a row in the database. Still, how can I make it happen?
I tried:
// TR Fading when deleted
$('.delete')
.click(function() {
$.ajax({
type: 'GET',
url: 'history/delete/id/'+$(this).attr('id'),
success: function() {
$(this).parent().parent().fadeOut();
}
});
return false;
});
without success
The this
reference doesn't refer to what you want (the .delete
element you clicked) in that success
function (it runs as a callback later), but you can fix that using $.proxy()
, like this:
$('.delete').click(function() {
$.ajax({
type: 'GET',
url: 'history/delete/id/'+$(this).attr('id'),
success: $.proxy(function() {
$(this).closest('tr').fadeOut();
}, this)
});
return false;
});
The .closest('tr')
is just a shorter way of getting the parent <tr>
, the proxy bit is the actual fix.
精彩评论