Question

I’m stuck on this small detail for few hours already, so please…
I am trying to fadeout an element if a different element is empty.
I am inside a ‘.js.haml’ file.

I tried this

- if($("#task-list-open").is(':empty')) 
  $("#open-task-container").fadeOut("slow");

and it seems that the ‘$’ in the first line is unexpected and raises a compile error.

The “#open-task-container” has the “#task-list-open” in it,
and I want to hide the whole ‘container’ if the ‘list’ is empty.

The html looks like this (I have simplified it):

<div id="open-task-container">
  <table class="ui-widget-header ui-corner-all" />
  <div id="task-list-open">
    <div id="task_1" class="task" />
    <div id="task_4" class="task" />
  </div>
</div>

Answer 1

You can try this:

var isEmpty = ($("#task-list-open div").length <= 0);