How to delete only from front-end and not from back-end

hi, I am writing a jQuery function and I want it to DELETE a post only from the front-end( only at the UI) and not at the back-end, but my code is deleting at both end, please I need a hand

 // DELETE POST 
    addPost.on('click','.delete', function(e) {
        e.preventDefault();
       var $section = $(this).closest('section');
        $.ajax({
            type: 'DELETE',
            url: 'http://localhost:3000/posts/' + $(this).attr('id'),
            success: function(){
               // $section.remove();
                $section.fadeOut(300, function(){
                    $(this).remove();
                });
            }
        })
    })

Don’t send a delete function to the backend, just remove the post from the DOM. You’re sending a request to a server, if you don’t want to make that request, don’t make it.

1 Like

Mmm, this doesn’t quite make sense.

If you are deleting an item, why don’t you want that deletion to hit the backend?

If you merely want to hide the post from the front end, you shouldn’t send a http delete request, but instead use CSS (or jQuery) to do so.


Edit: what Dan said :slight_smile:

thanks so much. Am grateful

1 Like

Am a newbies so I have not really get the hooks and cranes of out things work hand in hand, I know what I want my app to do. Thanks for the hint and the quick response. this has done the work. Thanks!

// DELETE POST 
      addPost.on('click','.delete', function(e){
        var $section = $(this).closest('section').remove();
      });
2 Likes

please can you help with the hint on how to make two or more modal form to open on top of each other, where the first will open normally and the click action on it will trigger the second modal to open on its top