获取多个复选框的值及其父输入字段

Posted

技术标签:

【中文标题】获取多个复选框的值及其父输入字段【英文标题】:Get value of multiple check boxes along with their parent input field 【发布时间】:2020-05-11 10:49:43 【问题描述】:

我想要一些建议或解决我遇到的情况的方法。我正在构建一个访问管理系统,我必须在其中为每个模块定义创建、读取、更新删除的权限。通过定义每个模块的权限,管理员将创建一个角色,稍后将分配给用户。如前所述,我有大约 14 个模块,每个模块都有四个权限。我通过一个复选框获取每个权限的输入,因此我有几个复选框,其父字段具有每个模块的id。这里有一些代码可以更好地理解我想要实现的目标以及我的方法是什么。

HTML:

<!-- Iteration loop starts here for rendering each module along with it's checkboxes -->
<tr>
    <th scope="row">$mod->m_name</th>
    <input type="hidden" name="module_id" value="$mod->m_id">
    <td><input type="checkbox" name="p_read" value="1"></td>
    <td><input type="checkbox" name="p_create" value="1"></td>
    <td><input type="checkbox" name="p_update" value="1"></td>
    <td><input type="checkbox" name="p_delete" value="1"></td>
</tr>
<!-- Loop ends here -->

查看:

JavaScript:

var foo = $('#formAddRole').serializeArray();
var json = "module" : [];

$.each(foo, (key, obj)=>
    var arr = 
        "module_id" : 0,
        "permissions" : 
            "create" : 0,
            "read" : 0,
            "update" : 0,
            "delete" : 0,
        
    ;

    if(obj.name == "p_read")
        arr.permissions.read = 1;
        json.module.push(arr);
    
    // conditions for 'p_create', 'p_update', 'p_delete' goes here...

    if(obj.name == "module_id")
        arr.module_id = obj.value;
        json.module.push(arr);
    
);

我要发送到服务器的 JSON 结构:

"modules" : [
    
        "module_id" : 1,
        "permissions" : 
            "create" : 1, 
            "read" : 1,
            "update" : 1,
            "delete" : 0,
        
    ,
    
        "module_id" : 2,
        "permissions" : 
            "create" : 0, 
            "read" : 1,
            "update" : 1,
            "delete" : 0,
        
    ,
    // so on...
 ]

我被困在这一点上。我使用的逻辑对我来说并不完全有用。有什么更好的方法,我怎样才能以最好的方式实现这一目标?任何帮助或建议将不胜感激。谢谢!

【问题讨论】:

【参考方案1】:

如果您使用的是 php,只需按照以下代码重命名您的字段。不需要 javascript...

<tr>
    <th scope="row">$mod->m_name</th>
    <input type="hidden" name="modules[0][module_id]" value="$mod->m_id">
    <td><input type="checkbox" name="modules[0][permissions][p_read]" value="1"></td>
    <td><input type="checkbox" name="modules[0][permissions][p_create]" value="1"></td>
    <td><input type="checkbox" name="modules[0][permissions][p_update]" value="1"></td>
    <td><input type="checkbox" name="modules[0][permissions][p_delete]" value="1"></td>
</tr>
<tr>
    <th scope="row">$mod->m_name</th>
    <input type="hidden" name="modules[1][module_id]" value="$mod->m_id">
    <td><input type="checkbox" name="modules[1][permissions][p_read]" value="1"></td>
    <td><input type="checkbox" name="modules[1][permissions][p_create]" value="1"></td>
    <td><input type="checkbox" name="modules[1][permissions][p_update]" value="1"></td>
    <td><input type="checkbox" name="modules[1][permissions][p_delete]" value="1"></td>
</tr>

这将在 PHP 中生成 $_GET 数组:

"modules" : [
    [
        "module_id" : 1,
        "permissions" : [
            "create" : 1, 
            "read" : 1,
            "update" : 1,
            "delete" : 0,
        ]
    ],
    [
        "module_id" : 2,
        "permissions" : [
            "create" : 0, 
            "read" : 1,
            "update" : 1,
            "delete" : 0,
        ]
    ]
 ]

【讨论】:

我使用 laravel 作为后端。但是我需要使用js,因为我通过ajax请求发送数据。 然后发送$('#formAddRole').serialize();。在 PHP 中读取 $_GET['modules']. 我不明白你的问题。您正在寻找更好的方法是什么?发送...解析...?你到底需要什么? 对于格式错误且不清楚的问题,我很抱歉,我想知道在我显示的json 输出中获取和设置所有字段数据的最佳方法是什么。 你说得对,我可以将所有字段直接发送到 php 并让 php 处理所有问题。我怎么没想到。 :) 任何方式,请编辑您的答案并包括您对社区的建议,以便我接受。

以上是关于获取多个复选框的值及其父输入字段的主要内容,如果未能解决你的问题,请参考以下文章

使用 jQuery 将复选框的值设为 1/0

jquery怎样获取多个复选框的值?

如何使用 jQuery 获取复选框的值并将它们吐到不同的表单字段中

如何更改多个填充的复选框输入字段值?

jquery怎样获取多个复选框的值?

Angular 2:获取多个选中复选框的值