Question

目前，我正在使用Codeigniter处理该项目，并面临我无法解决的挑战。

以下是观点：

enter image description here

如上图所示，有多个角色和权限可用。每个角色都有不同的权限存储在数据库中。此外，用户一次可以拥有多个角色。

目前，我可以选择用户的多个角色和权限，并且可以成功添加到数据库中。但问题是每个角色已经将其权限存储在数据库中。所以，我想让它更加用户友好和明智，当我检查任何User Role复选框然后使用Jquery / Javascript它应该自动检查所有相关的permissions复选框，以便了解哪个角色有什么权限。

任何帮助？

Answer 1

我会按照以下方式给每个预先设定一个值

premission 1 = 1
premission 2 = 2
premission 3 = 4
premission 4 = 8

角色的值将是他们拥有的预设的总和

所以

角色1（前提1,2,4）= 11
角色2（premission 2,3）6

然后获取最高预设值（在这种情况下为8）并检查已检查的角色。

所以11-8 = 3不小于0，所以预设4。
用最后一次检查（11-8）
3 - 4 = -1小于0. NOT premission 3.
取当前预设值的一半（2），但保持3
3 - 2 = 1不小于0，所以预设2。
再次相同

1 - 1 = 0不小于0，所以预设1。

$(".role").on("click", function(){
    $(".perm").prop("checked", false);
    $(".role:checked").each(function() {
        var reduceBy = maxFromDatabase;
        var roleRight = $(this).data("rights");
        while(reduceBy != 0) {
            if(!(roleRight - reduceBy < 0)) {
                $("input[data-right-val='"+reduceBy+"']").prop("checked", true);
                roleRight = roleRight-reduceBy;
            } 
            reduceBy = Math.floor(reduceBy/2);
        }
    });           
});

你可以检查这个小提琴的html（我使用数据属性）实现http://jsfiddle.net/8dcp4Lvk/3/

我将值放在html的数据属性中。我喜欢这个系统，因为它易于维护。您不需要在角色和提交之间的数据库中添加额外的表，添加预设或删除一个表就像从角色值中添加或删除它的值一样简单。

在小提琴中，您需要做的就是添加一个新的预设，值为64，第一个角色为64（71），maxFromDatabase为64（通常在查询时使用此值，相同包含所有数据值）。添加的好处是您也可以以相同的方式在PHP代码中使用这些值。

你可以扩展这个。为角色赋予类似premission（1,2,4等）的值，您可以将其用于用户。给他两个专栏（角色和预备），你给他的角色，他给你的角色，并预先分配你的预备总数。这样你只需要一些额外的colums，而不是额外的表。

Answer 2

快速思考，我将编辑此内容：我会创建一个jquery / javascript函数来检查使用ajax发送表单的角色的权限。

function checkRoles() {

      if($('#check_id1').is(":checked") or $('#check_id2').is(":checked") ){ //Check for the roles
        $.ajax({
          url: '<?php echo base_url(); ?>index.php/yourcheckingphp/yourcheckinmethod/',
          type: 'POST', //Here you send the form with the role
          data: $('#yourform').serialize(),
          success: function(data) { //If php returns data this function does this in a sucessful response or on error
            document.getElementById("Permission1").checked = true; //Enable as much permissions as you want, check them.
            document.getElementById("Permission2").checked = true;


            //ADD PERMISSIONS HERE!

          },
          error: function(error) {
            alert('Check your connection!');
            quitImageLoading();
          }
        });
      }

    }

在php中：

    public function yourcheckinmethod() {

//Get the checked roles (This may vary depending on your needs)

                $check_id1   = $this->input->post('check_id1');
                $check_id2   = $this->input->post('check_id2');
                $check_id3   = $this->input->post('check_id3');
                $check_id4   = $this->input->post('check_id4');

            //Call a php model with a connection to the database
                $result = $this->yourmodel->yourcheckinmethodMODEL($check_id1,$check_id2,$check_id3,$check_id4);
                echo $result;
       }   



                //In your DB model
                //With your db connection

     function yourcheckinmethodMODEL($check_id1,$check_id2,$check_id3,$check_id4) {
                    if($check_id1 != NULL){
                        $query = $this->db->query("SELECT * FROM Permissions WHERE ROLE = $check_id1");
                    }

                    //This may vary depending on your needs

                    return $query->result();
            }

Answer 3

在提供页面时，请确保提供某个JavaScript结构，该结构描述了哪个角色带来了哪个权限。之后，这是一个简单的点击事件跟踪并填写权限框。

我想你知道如何从数据库中读取角色和权限，以及如何在页面内提供以下JavaScript。

看看这个jsFiddle DEMO！

var roles = {
    master: {
        dashboard: true,
        companies: true,
        contractor: true
    },
    manager: {
        contractor: true,
        sites: true,
        guard: true
    },
    operation: {
        roster: true
    }
};

 $('.role').click(function() {
     var result = {};
     $('.role').each(function() {
         if (!$(this).prop('checked')) return;
         var role = $(this).attr('id');
         $.extend(result, roles[role]);
     });
     $('.perm').each(function() {
         var perm = $(this).attr('id');
         var chk = (perm in result);
         $(this).prop('checked', chk);
     });
 });

请注意，您还可以将其与用户特定权限（角色外部，如果允许）结合使用。如果您也想要此选项，请告诉我，我可以尝试更新源代码。

对象服务器比您的情况需要的多一点，因为它们具有布尔值，但稍后会更容易扩展使用。例如，如果选择了角色，则阻止某些权限。

Answer 4

也许这会有所帮助：http://jsfiddle.net/2mbwas6r/1/

HTML 的

<!-- Value could be the id of this group from your database //-->
<input type="checkbox" name="acl_group[]" value="1" /> Admin&nbsp;
<input type="checkbox" name="acl_group[]" value="2" /> Mod&nbsp;
<input type="checkbox" name="acl_group[]" value="12" /> User&nbsp;
<p>
    <!-- In data-in-acl-group add any group id from above surrounded by ; (semicolon) //-->
    <input type="checkbox" name="acl_rule[]" value="1" data-in-acl-group=";1;" />Perm 1&nbsp;
    <input type="checkbox" name="acl_rule[]" value="2" data-in-acl-group=";1;;2;" />Perm 2&nbsp;
    <input type="checkbox" name="acl_rule[]" value="3" data-in-acl-group=";2;" />Perm 3&nbsp;
    <input type="checkbox" name="acl_rule[]" value="4" data-in-acl-group=";1;;2;;12;" />Perm 4
    <br />
    <input type="checkbox" name="acl_rule[]" value="5" data-in-acl-group=";1;" />Perm 5&nbsp;
    <input type="checkbox" name="acl_rule[]" value="6" data-in-acl-group=";1;;2;" />Perm 6&nbsp;
    <input type="checkbox" name="acl_rule[]" value="7" data-in-acl-group=";1;;12;" />Perm 7&nbsp;
    <input type="checkbox" name="acl_rule[]" value="8" data-in-acl-group=";2;;1;" />Perm 8
</p>

JS

var aclGroupsSelected = [];
$('body').on('change', 'input[name^=acl_group]', function() {
    aclGroupsSelected = [];
    $.when( 
        $('input[name^=acl_group]:checked').each(function() {
            aclGroupsSelected.push($(this).val());
        })
    ).then(function(){
        $('input[data-in-acl-group]').removeAttr('checked');
        $(aclGroupsSelected).each(function(aclGroupIdIndex){
            $('input[data-in-acl-group*=";' + aclGroupsSelected[aclGroupIdIndex] + ';"]').each(function(){
                this.checked = "checked";
            });
        });
    });
});

Answer 5

不确定你想做什么......

如果你的问题只是动态地选择与角色相关的权限，这是一个使用jQuery的实现：http://jsfiddle.net/hkaqLfr

// List which permissions come with the role
// You can populate it during page creation
var roleHasPerm = {
  0:[2,3,4],
  1:[1,3,4],
  2:[3,5,9,6],
  3:[8,4,5,3],
  4:[1,4]
};

 // when a role is checked or unchecked
$('.check_role').change(function(){
    // get the role id
    var roleId = $(this).attr('data-id-role');
    // get the permissions associated to this role
    var permissions = roleHasPerm[roleId];

    if (!$(this).prop('checked'))
        return; // here you can chose what to do when user unchecks a role...

    // check every associated permissions
    permissions.forEach(function(permission){
        $('#perm_'+permission).prop('checked', true);
    });
});

如果你的问题出在其他地方，我就没有得到它......

警告：在https://developer.mozilla.org/fr/docs/Web/JavaScript/Reference/Objets_globaux/Array/forEach

检查forEach兼容性

Answer 6

不了解codeignitor。但如果这是我的问题，我会首先从数据库动态创建视图。（标签，复选框等）。

正如您所说“每个角色都有不同的权限存储在数据库中”;

首先我假设数据库像

[ name | id ] : master | 1; manager |  2; operation | 3; translink | 4; guard = 5;

AND子表如：

[parentPermissionId | permissionName | permissionId] : 1|dashboard|1; 1|guard|2; 1|rosterSite|3; 1|report|4;

依旧.....

现在在PHP中创建控制器

            <?php
                // i assume that you already done db conn and have a model
                $obj = new permission_model();
                $masterPermissions = $obj->masterPermission();
                // assuming that you fetch distinct child permission name and id from DB
                $childPermissions = $obj->childPermission();
            ?>

            for view
            <?php
                if(isset($masterPermissions)) {
                    foreach($masterPermisssions as $masterPermission) {
                        echo '<input type="checkbox" id="'.$masterPermission['id'].'"> '.$masterPermission['name'];
                    }
                }

                if(isset($childPermissions)) {
                    foreach($childPermisssions as $childPermission) {
                        echo '<input type="checkbox" id="'.$childPermission['id'].'"> '.$childPermission['name'];
                    }
                }


            ?>

        now from client side
        in jQuery 
        $('input[type="checkbox"]').click(function () {
            id = thid.id;
            // get permission from db in JSON format;
            $.getJSON('jsonPermission.php', { id : id }, function (data) {
                $.each(data.results, function() {
                    if(this.id === 1) {
                       $('#'+thid.id).prop('checked', true);
                    }
                });
            });
        });

        create JSON from PHP for jQuery
        <?php
            if(isset($_SERVER['HTTP_X_REQUESTED_WITH']) AND                    strtolower($_SERVER['HTTP_X_REQUESTED_WITH']) === 'xmlhttprequest' ) {

          require 'models/permission_model.php';

          $id = trim(htmlentities($_GET['id']));

          $obj = new permission_model();
          $infos = $obj->permissionChildIdFromParent($id);

          foreach($infos as $info) {
            array_push($results,array(
              'id'            => $info['id']
     ));
      }
      echo json_encode(array('results' => $results));

    }

        ?>

may be I am not more specific. but it will be if you show your DB table and code structure.

Answer 7

您应该创建一个权限系统，允许您这样做。例如：

您可以创建表：user，permissions，user_permissions，permission_groups 通过这种方式，您可以在＆＃34;权限＆＃34;中定义所有可能的权限。表，有一个表，您可以在其中分配用户特定的权限，一个表将权限组分配给权限。然后，您可以通过ajax简单地请求组的权限。

ui部分很容易解决。您可以为每个复选框分配一个带有数据库权限名称的id。所以当你进行ajax调用时，即：getManagerGroupPermissions - ＆gt;返回[perm1，perm2，perm3，perm4]，这样你就可以解析json并检查所有带有这些id的复选框。

Answer 8

假设您的html类似于 -

<div id="role_container">
    <input id="{ROLE_ID of Master here}" type="checkbox" />&nbsp;<label>Master</label>
    ----- Other Roles here -----
    ----- Other Roles here -----
    <input id="{ROLE_ID Guard here}" type="checkbox" />&nbsp;<label>Guard</label>
</div><br />
<div id="permission_container" >
    <input id="{Permission_ID of Company here}" type="checkbox" />&nbsp;<label>Company</label>
    ----- Other Permission here -----
    ----- Other Permission here -----
    <input id="{Permission_ID Roster here}" type="checkbox" />&nbsp;<label>Roster</label>
    ----- Other Permission here -----
    ----- Other Permission here -----
    <input id="{Permission_ID Form here}" type="checkbox" />&nbsp;<label>Form</label>
    ----- Other Permission here -----
    ----- Other Permission here -----
    <input id="{Permission_ID TimeSheet here}" type="checkbox" />&nbsp;<label>TimeSheet</label>
</div>

现在，我建议您在每个角色的复选框上添加数据属性。然后使用Premission_Ids（逗号分隔）填充此数据属性，如 -

<input id="{R_ID_Master here}" type="checkbox" data-permissions="{P_Id_Company}, {P_Id_Form}, {P_Id_Roster}" />&nbsp;<label>Master</label>
----- Other Roles here -----
----- Other Roles here -----
<input id="{R_ID_TimeSheet here}" type="checkbox" data-permissions="{P_Id_TimeSheet}, {P_Id_Sites}"/>&nbsp;<label>TimeSheet</label>

准备好此设置后，请调用此javascript函数onchange事件 -

function OnRoleCheckedChange(sender) {
    if (sender.checked) {
        var prrmissions = $(sender).attr("data-permissions").split(",");
        permissions.each(function () {
            $("div#permission_container input[type='checkbox'][id='" + this.trim() + "']").prop('checked', true);
        });
    }
}

如果您有条件，则可以在检查或取消选中之前将其应用于该功能

Answer 9

我认为这个问题需要两个步骤。

首先，您必须生成一个包含earch行所有权限的javascript对象。

var rolePermissions  = {
   master: [ 'dashboard', 'guard', 'sites'],
   manager: ['sites', 'timesheet'],
   operation: ['etc.' ]
};

现在当页面加载或用户选中角色复选框时：

获取所有选中的角色的所有权限，合并它们
遍历所有权限列表并选中相应的框

自动检查与数据库中该ID相关的复选框

9 个答案: