jQuery скрыть заголовок ul, когда все записи удалены

Question

Я нуб с jQuery ... и я надеюсь, что объяснил это достаточно хорошо; У меня есть заголовок <ul>, который появляется, когда я добавил запись в динамически создаваемый список, используя $.post. С каждой добавленной записью связана кнопка удаления / редактирования.

Заголовок это:

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

Мой динамический список, который создается:

<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

Мой вопрос: есть ли какое-то условие, которое я могу использовать с jQuery, чтобы скрыть class="header", если все элементы удалены? Я читал об условных утверждениях, таких как is и not с jq, но я не совсем понимаю, как они работают. Все элементы в class="addedItems" хранятся в data, созданном JSON.

Это функция удаления:

  $(".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

Вот файл 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);
    }

    ?>

Answer 1

попробуйте это:

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();

        //CHECK IF THERE ARE NOT ANY LI ITEMS IN UL
        if($("ul.addedItems li").length==0){
            $("ul.header").hide();//HIDE HEADER LIST
        }

    } else if(data.error) {
      // throw error if item does not delete
    }
}

Answer 2

Основываясь на некоторых ответах здесь, я пришел к следующему:

    if($("ul.header").siblings("ul.addedItems").is(":visible")) {
    } else {
      $("ul.header").hide();
    }

Спасибо всем за понимание.

Answer 3

Полагаю, вам нужна каждая функция:

$(del).parents('.header').each(function(){
  if ( $(this).children('.addedItems:visible').length == 0 )
  {
    $(this).hide();
  }
});

При вызове этого крошечного скрипта любой UL .header будет скрыт без дочерних элементов.

поместите этот скрипт после вашего $(del).parents(".addedItems").hide();