Create a list from selected list items

Question

I have a fiddle here: my fiddle. What I am trying to do is create a list of items from a separate group of lists. I cannot seem to get a grasp on what I am doing wrong, but here is whats happening:

I have a group of lists based on tabular data
Each list has the name of the column and a selection checkbox
If I select an item, it needs to be added to the selected columns area (vertical list)
There are 14 unique tabular items with checkboxes
(PROBLEM -->) When I select an item, it gets added 14 times in the selected columns section

code

(html):

I tried ti insert HTML but is not working right. Please look at the fiddle listed above.

(jquery):

var dte = // drag table elements
{
init: function() {
    var chkbx = $('.group input[type="checkbox"]:checkbox');
    //var chkbx = $('#accordion');
    for (var i = 0, ii = chkbx.length; i < ii; i++) {
        $(chkbx).bind("click", dte.adjustList);
    }
},

adjustList: function(event) {
    var list = [];
    var str = '';
    var eleval = event.currentTarget.value;
    var eleid = event.currentTarget.id;
    if (eleval == 1) {
        list.push(eleid);
        str = '<li>' + eleid + '</li>';
    }
    $('#vertical ul').append(str);
/*
    //var ele = event.currentTarget.id;
    var allVals = [];
    var str = '';
    //var obj = $("#"+ele);
    var ele = $('#accordion');
    $(obj+': checked').each(function(){
        allVals.push($(this.val()));
        dte.list.push($(this.val()));
        str += '<li>'+$(this.val())+'</li>';
    });
    $('#verticle').text(str);
    alert('List: ' + toString(list));
    */
}
};
dte.init();

$('.group input:checkbox') == $('.group input[type="checkbox"]') — deerua
– deerua, Commented Jun 14, 2012 at 13:41

deerua · Accepted Answer · 2012-06-14 13:38:18Z

2

init: function() {
    $('.group input:checkbox').bind("click", dte.adjustList);
},

answered Jun 14, 2012 at 13:38

deerua

4082 silver badges9 bronze badges

Sign up to request clarification or add additional context in comments.

2 Comments

Imdad Over a year ago

This is the first and the best answer. +1

radi8 Over a year ago

As always, I am always over thinking the problem. Thanks for all your help. This did the trick

AbstractChaos · Accepted Answer · 2012-06-14 13:39:54Z

0

you only need to bind once based on your selector.

init: function() {
        var chkbx = $('.group input[type="checkbox"]:checkbox');
        $(chkbx).bind("click", dte.adjustList);
 },

fiddle

answered Jun 14, 2012 at 13:39

AbstractChaos

4,2111 gold badge21 silver badges28 bronze badges

Comments

Chibuzo · Accepted Answer · 2012-06-14 13:40:14Z

0

I have edited your fiddle, I removed the for loop. Here is the link updated fiddle You only need to bind the click event once.

answered Jun 14, 2012 at 13:40

Chibuzo

6,1133 gold badges33 silver badges54 bronze badges

Comments

emphaticsunshine · Accepted Answer · 2012-06-14 13:40:16Z

0

You are binding events multiple time. You can do something like this:

init:function(){
  $('.group input[type="checkbox"]:checkbox').bind('click',dte.adjustList);
},

Edited your fiddle:

http://jsfiddle.net/emphaticsunshine/tPAmc/

answered Jun 14, 2012 at 13:40

emphaticsunshine

3,7857 gold badges35 silver badges42 bronze badges

Collectives™ on Stack Overflow

Create a list from selected list items

4 Answers 4

2 Comments

Comments

Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

4 Answers 4

2 Comments

Comments

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related