为每个选中的复选框创建隐藏的输入

大街

我正在尝试为选中的每一行在表单内部创建一个隐藏输入,并且我想使用来自隐藏列的ID插入每个隐藏输入的值。

这是我到目前为止所拥有的:

.on('check.bs.table check-all.bs.table', function (row) {           
        var selects = $('#users-table').bootstrapTable('getSelections');
            ids = $.map(selects, function (row) {
                return row.id;                          
            });                 
                    var input = document.createElement("input");
            input.setAttribute('type', 'hidden');           
            input.setAttribute('name', 'delete['+ids+']');
            input.setAttribute("id", 'delete['+ids+']');            
            input.setAttribute('value', 'delete['+ids+']');         
            //append to form element that you want .
            document.getElementById("deleteModalForm").appendChild(input);  
        })

它正在为每个要检查的框创建一个新的隐藏输入,就像我想要的那样,但是我遇到的问题是它将id连接在一起。这是发生的情况的示例:

<input value="delete[3]" id="delete[3]" name="delete[3]" type="hidden">
<input value="delete[3,2]" id="delete[3,2]" name="delete[3,2]" type="hidden">

我想要它做的是:

<input value="delete[3]" id="delete[3]" name="delete[3]" type="hidden">
<input value="delete[2]" id="delete[2]" name="delete[2]" type="hidden">

如果有帮助,我正在使用Bootstrap数据表

有人可以帮我吗?

编辑:这是一个JSFiddle当您选中该框时,它将添加一个新输入,并且您会看到每个输入都与数字相连。对于此示例,我没有使用type="hidden"

阿图尔·菲律宾(Artur Filipiak)

为什么不直接使用row.stargazers_count

row是当前选定行的对象,row.stargazers_count代表列的行值data-field='stargazers_count'

input.setAttribute('value', 'delete['+row.stargazers_count+']');

演示

getSelections做同样的工作,但是它将所有选定的行都带入对象,因此您必须提取最后一个:

var selects = $table.bootstrapTable('getSelections');
var stars   = selects[selects.length-1].stargazers_count;
input.setAttribute('value', 'delete['+stars+']');

但这对数组是不必要的操作,因为您有row权利,为此,您将其传递给事件:

.on('check.bs.table', function (e, /* here it is: */ row){

您的代码有更多问题:

  • 当您重复输入名称时,这将行不通:

    input.setAttribute('name', 'delete['+row.stargazers_count+']');
    

    改用它,它将在提交时自动创建名称数组:

    input.setAttribute('name', 'delete[]');
    
  • 这也行不通,因为您重复输入id(它们必须是唯一的):

    input.setAttribute("id", 'delete['+row.stargazers_count+']');
    

    row.id改为使用

    input.setAttribute("id", 'delete_'+row.id);
    

为什么将ID一起加入?

.map()将数组或对象中的所有项目转换为新的项目数组

参考

本文收集自互联网,转载请注明来源。

如有侵权,请联系[email protected] 删除。

编辑于
0

我来说两句

0条评论
登录后参与评论

相关文章

来自分类Dev

未选中复选框时隐藏输入

来自分类Dev

jQuery:如果选中复选框,则隐藏输入框

来自分类Dev

如果复选框已选中,则隐藏复选框

来自分类Dev

在选中复选框之前隐藏 div

来自分类Dev

验证复选框创建的输入隐藏字段

来自分类Dev

选中/取消选中复选框以使用 javascript 显示/隐藏输入文件元素

来自分类Dev

禁用每个未选中的复选框

来自分类Dev

反应输入复选框已选中

来自分类Dev

禁用输入,直到选中复选框

来自分类Dev

输入类型复选框无法选中

来自分类Dev

jQuery隐藏复选框选中,但不取消选中

来自分类Dev

选中时创建一个复选框,它应该在模式中显示某些输入字段并隐藏其他输入字段

来自分类Dev

如果选中了输入类型复选框,则创建和删除输入类型文本

来自分类Dev

jQuery获取相应复选框的隐藏值在MVC Razor中选中为true

来自分类Dev

jQuery / JavaScript:选中所有复选框并选中每个复选框以显示div

来自分类Dev

根据输入内容选中/取消选中复选框

来自分类Dev

根据输入内容选中/取消选中复选框

来自分类Dev

禁用复选框的选中/取消选中输入

来自分类Dev

如何为每个选中的复选框创建一个递增1的变量

来自分类Dev

选中输入复选框。选中其他帖子的复选框

来自分类Dev

如何使用复选框创建“全部选中/取消选中”?

来自分类Dev

将复选框设置为基于其他输入值选中

来自分类Dev

在每个标签旁边创建复选框

来自分类Dev

选中复选框时显示/隐藏面板

来自分类Dev

如果选中复选框,则显示或隐藏表行

来自分类Dev

选中复选框时显示/隐藏div

来自分类Dev

未选中复选框时隐藏div

来自分类Dev

显示或隐藏WebGrid的“全部选中”复选框上的按钮

来自分类Dev

选中复选框时隐藏/显示行

Related 相关文章

  1. 1

    未选中复选框时隐藏输入

  2. 2

    jQuery:如果选中复选框,则隐藏输入框

  3. 3

    如果复选框已选中,则隐藏复选框

  4. 4

    在选中复选框之前隐藏 div

  5. 5

    验证复选框创建的输入隐藏字段

  6. 6

    选中/取消选中复选框以使用 javascript 显示/隐藏输入文件元素

  7. 7

    禁用每个未选中的复选框

  8. 8

    反应输入复选框已选中

  9. 9

    禁用输入,直到选中复选框

  10. 10

    输入类型复选框无法选中

  11. 11

    jQuery隐藏复选框选中,但不取消选中

  12. 12

    选中时创建一个复选框,它应该在模式中显示某些输入字段并隐藏其他输入字段

  13. 13

    如果选中了输入类型复选框,则创建和删除输入类型文本

  14. 14

    jQuery获取相应复选框的隐藏值在MVC Razor中选中为true

  15. 15

    jQuery / JavaScript:选中所有复选框并选中每个复选框以显示div

  16. 16

    根据输入内容选中/取消选中复选框

  17. 17

    根据输入内容选中/取消选中复选框

  18. 18

    禁用复选框的选中/取消选中输入

  19. 19

    如何为每个选中的复选框创建一个递增1的变量

  20. 20

    选中输入复选框。选中其他帖子的复选框

  21. 21

    如何使用复选框创建“全部选中/取消选中”?

  22. 22

    将复选框设置为基于其他输入值选中

  23. 23

    在每个标签旁边创建复选框

  24. 24

    选中复选框时显示/隐藏面板

  25. 25

    如果选中复选框,则显示或隐藏表行

  26. 26

    选中复选框时显示/隐藏div

  27. 27

    未选中复选框时隐藏div

  28. 28

    显示或隐藏WebGrid的“全部选中”复选框上的按钮

  29. 29

    选中复选框时隐藏/显示行

热门标签

归档