jQuery hide ul header when all entries are deleted...

Posted by Scott on Stack Overflow See other posts from Stack Overflow or by Scott
Published on 2009-10-06T09:07:46Z Indexed on 2010/03/30 13:03 UTC
Read the original article Hit count: 421

Filed under:

I'm a noob with jQuery...and I hope I've explained this well enough; I have a <ul> header that appears when I've added an entry to a dynamically created list using $.post. Each entry added has a delete/edit button associated with it.

Header is this:

<ul class="header">
    <li>Month</li>
    <li>Year</li>
    <li>Cottage</li>
</ul>

My dynamic list that is created:

<ul class="addedItems">    
    <li>Month</li>
    <li>Year</li>
    <li>Cottage</li>
    <li><span class="edit">edit</span></li>
    <li><span class="del">delete</span></li>
</ul>


This all looks like this:

Month        Year        Cottage    <--this appears after I've added an entry
--------------------------------       and I want it to stick around unless 
                                       all items are deleted.


Dec          1990        Fir        edit/delete  <--entries   
Jan          2000        Willow     edit/delete

My question is: Is there some kind of conditional that I can use with jQuery to hide the class="header" if all the items are deleted? I've read up on conditional statements like is and not with jq but I'm not really understanding how they work. All of the items in class="addedItems" is stored in data produced by JSON.

This is the delete function:

  $(".del").live("click", function(){
      var del = this;
      var thisVal = $(del).val();
      $.post("delete.php", { dirID : thisVal },
       function(data){
        if(confirm("Are you sure you want to DELETE this entry?") == true) {
           if(data.success) {
            //hide the class="header" here somwhere??
            $(del).parents(".addedItems").hide();
           } else if(data.error) {
            // throw error if item does not delete
           }
         }
       }, "json");
        return false;
    }); //end of .del function

Here is the delete.php

    <?php

    if($_POST) {


      $data['delID'] = $_POST['dirID'];

      $query = "DELETE from //tablename WHERE dirID = '{$data['delID']}' LIMIT 1";

      $result = $db->query($query);

      if($result) {
        $data['success'] = true;
        $data['message'] = "Entry was successfully removed.";
      } else {
        $data['error'] = true;
        $data['message'] = "Item could not be deleted.";
      }

      echo json_encode($data);
    }

    ?>

© Stack Overflow or respective owner

Related posts about jQuery