如何附加复选框名称？

在这个小提琴中有一个To ，当它按下一个modal dialog时出现。对话框有一个下拉菜单。当选择groups或users下拉时，会出现一个带复选框的表。请告诉我如何附加支票选中复选框时的框名称，或者取消选中复选框时删除附加的名称。

追加我必须喜欢这个

 $('#ToAdd').append('hi'); 

但我不知道如何调用它并获取值。请帮助

例

假设选择了组菜单，并从下面的复选框中选择第1行然后hhh将显示在范围中

Answer 1

首先，我将两个表#mytable和#groupTable到对话框中

 
 
Users  ...  
 
Groups  ...  
  

这简化了两个选项卡之间的切换

 $('.select').on('change', function () { var tablink = '#' + $(this).val(); $('a[href="' + tablink + '"]').tab('show'); }); 

现在，您可以轻松获取已检查的名称

 function collect_users() { var users = []; $('input:checked', '#mytable').closest('td').next('td').each(function() { users.push($(this).text()); }); $('#ToAdd').text(users.join(', ')); } $('#mytable input:checkbox').click(collect_users); 

类似于#groupTable 。

见修改后的JSFiddle

Answer 2

在一些div / form添加复选框并处理change事件，

 $('#container input:checkbox[name=groupname]').on('change', function (event) { $("#Toadd").html(''); $('#container input:checkbox[name=groupname]:checked').each(function() { $("#Toadd").append($(this).attr('data-id')); } }); 

工作演示

Answer 3

试试这个小提琴jsfiddle

每次动态创建表时，都必须绑定更改事件。 对前一个小提琴抱歉。

  $("input[type='checkbox']", "#mytable1").on('change', function (event) { $("#ToAdd").html(''); $("input[type='checkbox']:checked", "#mytable1").each(function() { $("#ToAdd").append($(this).parent().next().text() + " "); }); }); 

如果需要，您可以为组创建相同的内容。