首页 > 解决方案 > 将条件用户访问放在 ajax 上

问题描述

所以,我有一个 ajax 脚本,并且有一个用户可以看到表,但它不能更新或删除表上的数据。这是脚本

function tampil_data_asum(){
        $.ajax({
            type  : 'ajax',
            url   : 'json_asum',
            async : false,
            dataType : 'json',
            success : function(data){
                var html = '';
                var i;
                for(i=0; i<data.length; i++){
                    html += '<tr>'+
                            '<td>'+(i+1)+'</td>'+
                            '<td>'+data[i].tertanggung+'</td>'+
                            '<td>'+data[i].no_polis+'</td>'+
                            '<td>'+data[i].tgl_polis+'</td>'+
                            '<td>Rp.'+number_format(data[i].premi)+'</td>'+
                            '<td>Rp.'+number_format(data[i].komisi)+'</td>'+
                            '<td>'+data[i].keterangan+'</td>'+
                            '<td class="text-center">'+
                                '<button  class="btn btn-success btn-xs asum_detail" data="'+data[i].id_asum+'"><i class="fa fa-info-circle"></i></button>'+' '+
                                 '<button  class="btn btn-info btn-xs asum_edit" data="'+data[i].id_asum+'"><i class="fa fa-edit"></i></button>'+' '+
                                '<button " class="btn btn-danger btn-xs asum_hapus" data="'+data[i].id_asum+'"><i class="fa fa-trash"></i></button>'+
                            '</td>'+
                            '</tr>';
                }
                $('#show_data_asum').html(html);
            }

        });
    }

我想在按钮上设置条件,所以当用户登录时,他无法访问这些按钮

标签: javascriptphpjqueryajaxcodeigniter-3

解决方案


由于您的条件基于用户的水平,我建议使用这种css方法。只需在 if 条件下检查用户级别

    var html = '';
    var i;

if(user_level >= 5) { 
//add one css class which will make the button non-clickable 

    for(i=0; i<data.length; i++){
                            html += '<tr>'+
                              //your other tds
                             //added the no-click class to the buttons
                                    '<td class="text-center">'+
                                        '<button  class="no-click btn btn-success btn-xs asum_detail" data="'+data[i].id_asum+'"><i class="fa fa-info-circle"></i></button>'+' '+
                                         '<button  class="no-click btn btn-info btn-xs asum_edit" data="'+data[i].id_asum+'"><i class="fa fa-edit"></i></button>'+' '+
                                        '<button " class="no-click btn btn-danger btn-xs asum_hapus" data="'+data[i].id_asum+'"><i class="fa fa-trash"></i></button>'+
                                    '</td>'+
                                    '</tr>';
                        }

} else {
//no need add the class to the buttons. just paste your existing code


}

                    $('#show_data_asum').html(html);

CSS:

.no-click {
    pointer-events: none;
}

推荐阅读