仅当图像列表中有多个图像时，才显示“删除”链接

Question

Im deleting banner images using jQuery and Ajax.

But if I have just one image I dont want to delete it.

I have a list of images, and for each image I have this link:

echo '<a class="delete j_bannerdelete" id="'.$rslt_banner['id'].'" href="#">Delete</a> ';

And I was thinking something about tihs, just show "Delete" link if my row count was more than 1.

if($read_ban->rowCOunt() >1{
     echo '<a class="delete j_bannerdelete" id="'.$rslt_banner['id'].'" href="#">Delete</a> ';
}

But like this, for example If I have 2 images, I delete one, and as Im deleting with ajax, my page dont refresh, so I have my last image with my "Delete" link and so I can delete it.

Do you know aa simple way to solve this?

My delete code:

$(function(){
    var banner_id = null;
    $("a#no").click(function(event){
        event.preventDefault();
        $('.confirm').fadeOut("slow",function(){
            $('.delete_dialog').fadeOut("slow"); 
        });
        $('.bannerli li[id="'+ banner_id +'"]').css('background','#f5f5f5');
        banner_id = null;
    });
    $("a#delete").click(function(event){
        event.preventDefault();
        if (!banner_id) return;
        $.post(url,{action:'ban',id: banner_id},function(){
            window.setTimeout(function(){
                $('.bannerli li[id="'+ banner_id +'"]').fadeOut("slow");
            },500);
            $('.confirm').fadeOut("fast",function(){
                $('.delete_dialog').fadeOut("fast"); 
            });
        });
    });
    $('.bannerli').on('click','.j_bannerdelete',function(){
        banner_id = $(this).attr('id');
        $('.bannerli li[id="'+ banner_id +'"]').css('background','red');
        $('.delete_dialog p').text('Are you sure you want to remove this banner?');
        $('.delete_dialog').fadeIn("slow",function(){
            $('.confirm').fadeIn("slow");
        });
        return false;
    })
});

Answer 1

I created a simplified solution here: http://jsfiddle.net/wgjrnw7m/1/ . It should give you an idea of how to do it.

Basically you want to count how many items you have:

if($('.bannerli').length <= 1) { /* Hide delete */ }

And you want to do this check everytime an item is deleted. If items can also be added, you also need to check if you have more than one item and in that case show all the delete-buttons again.

Answer 2

count how many banners are still on the page with a jQuery selector. than only show the delete functionality if

if ( $('.j_bannerdelete').length > 1 ) {
...