Add selected items from gridview to a list using Javascript

Question

I have few gridviews with a checkbox. I want the selected items in the gridview to be populated in a seperate list. Please suggest me a javascript library which can be useful. Example as below : Please see the pic

http://i46.tinypic.com/2ibnar5.jpg

Answer 1

You can do this by using the cloneNode DOM method but it gets a lot easier using jQuery. Untested conceptual code:

<script type="text/javascript" src="jquery-1.4.min.js"></script>
<script type="text/javascript">
$(document).ready(function() {
    $("input:checkbox").click(function() {
        if($(this).is(':checked')) {
            var $item = $("<li id=\"copy_" + $(this).attr("id") +  "\">");
            $item.text($(this).parent().text());
            $("#selectedList").append($item);
        }
        else {
            $("#copy_" + $(this).attr("id"), "#selectedList").remove();
        }
    });
});
</script>

And in your HTML:

<ul id="itemList">
    <li><input type="checkbox" id="one" />one</li>
    <li><input type="checkbox" id="two" />two</li>
</ul>
<ul id="selectedList"></ul>

HTH,

JS