Combining function

JavaScript
1

The way this code is now means that I’d have to manually add to it code if the number of alerts increases. How can I combine the code below to adjust on its own to accommodate any number of alerts.

// Alert session cookie starts here 
$(document).ready(function(){ 

 $('.alert-box').attr('id', function(i) {
   return 'alert'+(i+1);
});

function closeBox(){    
      
        var closeBox = $('#alert1').remove();
    // - Notice how we pass a function and get an integer
        $.cookie('Box-closed', true, {path: '/'});
        
    }
    
    // - Simply checks the alert box above
    if($.cookie('Box-closed')){
        console.log('Closing the alert box automatically...');
        closeBox();
        
    }
    
        // Close the box on click
    $('#alert1 .alert-switch').click(function () {
           
           closeBox();
        
    });    
    
    
    function closeBox2(){          
        var closeBox2 = $('#alert2').remove();
    // - Notice how we pass a function and get an integer
        $.cookie('Box2-closed', true, {path: '/'});
        
    }
    
    // - Simply checks the alert box above
    if($.cookie('Box2-closed')){
        console.log('Closing the alert box automatically...');
        closeBox2();
        
    }
    
        // Close the box on click
    $('#alert2 .alert-switch').click(function () {
           
           closeBox2();
        
    });
    
    
    
    function closeBox3(){          
        var closeBox3 = $('#alert3').remove();
    // - Notice how we pass a function and get an integer
        $.cookie('Box3-closed', true, {path: '/'});
        
    }
    
    // - Simply checks the alert box above
    if($.cookie('Box3-closed')){
        console.log('Closing the alert box automatically...');
        closeBox3();
        
    }
    
        // Close the box on click
    $('#alert3 .alert-switch').click(function () {
           
           closeBox3();
        
    });
    

    });
2

Would the following work?

$('.alert-switch').click(function() {
    closeBox(this.id);
});

function closeBox(id) {
    var closeBox = $('#' + id).remove();
    var number = id.substring(id.length-1);

    $.cookie('Box' + number + '-closed', true, {path: '/'});
}

for(var i = 1, len = $('.alert-switch').length; i <= len; i++) {
    if($.cookie('Box' + i + '-closed')) {
        console.log('Closing the alert box automatically...');
        closeBox('alert' + i);
    }
}
4

@israelnyc I tried it but it doesn’t stay closed, and I do not know why.

5

Is any part of it working; are the cookies at least being created when manually closing the alerts?

EDIT: If the cookies are being created but just them staying closed isn’t working, check to see that the for loop is actually looping through something. It may need to be in the $(document).ready portion of the script if the alert elements aren’t in the DOM when the loop runs.

6

I’ll check and then get back to you.

7

Could you post a link to a demo page of this not working for you?

Actually, does this relate to your other thread?

8

This topic was automatically closed 91 days after the last reply. New replies are no longer allowed.