items-list.html

<div class='span-10 {{ ctx }} cell'>
  <div class='cell-head clearfix'> 
    <h3> {{ ctx|title }} </h3>
    <a href='#' onclick="showNewForm('{{ ctx }}')" style='float:right'> New </a>
  </div>
  
  <div class='items'>
    <form method='POST' action='/' style='display:none' id='form-{{ ctx }}'>
      <input type='checkbox' />
      <input type='text' id='new_item-{{ ctx }}' name='new_item' cols=40 />
      <input type='submit' name='add_item' value='Add' />
      <input type='hidden' name='category' value='{{ ctx }}'>
      <a href='#' onclick='$("#form-{{ ctx }}").hide()'> x </a>
    </form>
    
  {% if items_by_ctx %}
  <ul>
    {% if items_by_ctx|hash:ctx %}
    {% for i in items_by_ctx|hash:ctx %}
    <li id='list_{{ i.key.id }}' class='item clearfix'> 
      <input type='checkbox' onclick='updateItem(this, {{ i.key.id }})' class='item-check'>
      <div class='name' id='item-name-{{ i.key.id }}'>{{ i.name }}</div>
      <a href='#' onclick='deleteListItem({{ i.key.id }})'>
        <img style='width:10px; opacity: 0.5; vertical-align:middle' src='/static/del.png' />
      </a>
    </li>
    {% endfor %}
    {% else %}
    <script>$('#form-{{ ctx }}').show();</script>
    <center style='color: #555; margin-top: 1.5em;'>
      --- Nothing else here yet! ---
    </center>
    {% endif %}
  </ul>
  {% else %}
  <h2 align='center' class='empty-msg'>Nothing here yet! Get started by creating a few items</h2>
  {% endif %}
  </div>
</div>