Hello everyone,
I am currently building a website for a friend and require some
mootools help. What I have is a zebra table but require the use of the
Animated Ajax Deletion script from davidwalsh.name . It all works
fine, however my problem is that when it slides out, the row shrinks
to the left then slides out. I am wondering if it is possible to
delete the whole row with out any part of it shrinking.
JS:
$$('.done').addEvent('click',function() {
var parent =
this.getParent('td').getParent('tr');
var request = new Request({
url:
'/core/subjects/functions/deleterow.php',
link: 'chain',
method: 'get',
onRequest: function() {
new Fx.Tween(parent,{
duration:150
}).start('background-color', '#fb6c6c');
},
onSuccess: function() {
new Fx.Slide(parent,{
duration:1000,
onComplete:
function() {
parent.destroy();
}
}).slideOut();
}
}).send();
});
HTML:
<table class="zebra" width="100%" border="0" cellpadding="0"
cellspacing="0">
<tr>
<th><ol>
<li>Name</li>
</ol></th>
<th><ol>
<li>Place</li>
</ol></th>
<th><ol>
<li>Number</li>
</ol></th>
</tr>
<tr class="even">
<td><ol>
<li>J Smith</li>
</ol></td>
<td><ol>
<li>123456</li>
</ol></td>
<td><ol>
<li><a class="done" href="#">029748466</a></li>
</ol></td>
</tr>
<tr>
<td><ol>
<li>W. Dory</li>
</ol></td>
<td><ol>
<li>456786</li>
</ol></td>
<td><ol>
<li><a class="done" href="#">029748466</a></li>
</ol></td>
</tr>
<tr>
<td><ol>
<li>S. Jobs</li>
</ol></td>
<td><ol>
<li>245786</li>
</ol></td>
<td><ol>
<li><a class="done" href="#">029748466</a></li>
</ol></td>
</tr>
<tr>
<td><ol>
<li>B. Gates</li>
</ol></td>
<td><ol>
<li>56756678</li>
</ol></td>
<td><ol>
<li><a class="done" href="#">029748466</a></li>
</ol></td>
</tr>
<tr>
<td><ol>
<li>M. yself</li>
</ol></td>
<td><ol>
<li>5673456</li>
</ol></td>
<td><ol>
<li><a class="done" href="#">029748466</a></li>
</ol></td>
</tr>
<tr>
<td><ol>
<li>H. Potter</li>
</ol></td>
<td><ol>
<li>978564</li>
</ol></td>
<td><ol>
<li><a class="done" href="#">029748466</a></li>
</ol></td>
</tr>
</table>
When they click on the ph. number, it indicates that they have called
them, hence the requirement of the deletion script.
[HTML data has been modified]
Any help would be much appreciated...