vendredi 29 avril 2016

Copy all checked list item to another list

I trying to realize some features.
When I checked item, it copy to second list.
All work.
I add button, which sets all checkbox as checked. But when I click it, all items dont copy to second list. Can you help me?

<p>First List</p>
<ul class='first-list'>
  <li>
    <input type='checkbox' id='ckbx1'><label for='ckbx1'>One</label>
  </li>
  <li>
    <input type='checkbox' id='ckbx2'><label for='ckbx2'>Two</label>
  </li>
  <li>
    <input type='checkbox' id='ckbx3'><label for='ckbx3'>Tree</label>
  </li>
  <li>
    <input type='checkbox' id='ckbx4'><label for='ckbx4'>Four</label>
  </li>
</ul>
 <span class="addAll">Add All</span>
<p>Second List</p>
<ul class='second-list'>
</ul>

And Jquery

var $chk = $('.first-list input').change(function() {
  $('.second-list').html(
    $chk.filter(':checked').map(function() {
      return $(this).parent().clone();
    }).get()
  );
})
$('.addall').click(function() {
    $('.first-list input').prop('checked',true);
})

Here is fiddle - http://ift.tt/24p79tR

Thanks a lot and sorry for my english.




Aucun commentaire:

Enregistrer un commentaire