Delete the uploded image file using ajax code

Delete the uploded image file using ajax code

I want to delete the images that are uploded one by one in php.
I used the following code for displaying the images.On clicking the delete
button the image gets deleted from the upload folder.
Code
ImageLap.tpl.php
foreach($mainfile as $files)
{
echo '<img src="'.$files.'" width="100" height="65">';
echo '<input type="hidden" value="'.$files.'"
name="delete_file" />';
echo '<input type="submit" value="Delete image" />';
}
ImageLap.php
if (array_key_exists('delete_file', $_POST))
{
$filename = $_POST['delete_file'];
if (file_exists($filename))
{
unlink($filename);
echo 'File '.$filename.' has been deleted';
}
}
This code is working well.But the page has to be refreshed on each file
deletion. I need a help to delete the files without refreshing the page.I
heard that ajax is used for this.But I don't have knowledge in ajax
Please do help me to implement ajax in this code.