CODEWITHSUNDEEP
phpjquery
st4ck0v3rfl0w
st4ck0v3rfl0w

Reputation: 6755

jQuery + <a> tag

I've created a Facebook/Twitter style status update where the new Status' get added to an unordered list. I now want to add a "REMOVE" function to it, however, I'm not sure how to best accomplish this.

  1. In my list item, create my [a] tag with the unique ID of the status post ID and set a listener class
  2. Have jQuery listen for [a] tags with the listener class
  3. POST the ID over to the PHP script to remove the post; if successful return with "ok" or if failed return with "fail"
  4. In the callback function, if it's OK, then find the element and remove it

Upvotes: 0

Views: 210

Answers (1)

Harmen
Harmen

Reputation: 22438

HTML:

<li id="id-1234">
   Some text
   <a href="#" class="remove_li">Remove</a>
</li>

Javascript:

$(document).ready(){
    $('.remove_li').live('click', function(){
       var id = $(this).parent().attr('id').substring(3);
       var that = this;
       $.post('url.php', {id: id}, function(data, status){
           if(status == 'success'){
               $(that).parent().remove();
           } else {
               alert("Couldn't delete");
           }
       });
    });
}

Upvotes: 2

Related Questions