如何基于复选框动态地触发的Ajax发布插入/删除数据(选中或未选中)

时间:2019-03-29 14:32:36

标签: javascript jquery ajax codeigniter

我有1个表,每行有1个复选框,因此如果行中有1个数据选中,则表示插入,而未选中表示删除表中的数据。

这是我的桌子的照片: https://imgur.com/p4iTN8C

这是我表的代码(admin / roleaccess):

<div class="row">
    <div class="col-lg-6">
        <?= $this->session->flashdata('message'); ?>

        <table class="table table-hover">
            <thead>
                <tr>
                    <th scope="col">#</th>
                    <th scope="col">Menu</th>
                    <th scope="col">Akses</th>
                </tr>
            </thead>
            <tbody>
                <?php $i = 1; ?>
                <?php foreach ($menu as $m) : ?>
                <tr>
                    <th scope="row"><?= $i; ?></th>
                    <td><?= $m['menu'] ?></td>
                    <td>
                        <div class="form-check">
                            <input class="form-check-input" type="checkbox" <?= check_access($role['id_lvl'], $m['id']); ?> data-role="<?= $role['id_lvl']; ?>" data-menu="<?= $m['id']; ?>">
                        </div>
                    </td>
                </tr>
                <?php $i++ ?>
                <?php endforeach; ?>
            </tbody>
        </table>
    </div>
</div>

我的脚本:

<script>
$('.form-check-input').on('click', function() {
    const menuId = $(this).data('menu');
    const roleId = $(this).data('role');

    $.ajax({
        url: "<?php base_url('admin/changeAccess'); ?>",
        type: 'post',
        data: {
            menuId: menuId,
            roleId: roleId
        },
        success: function() {
            document.location.href = "<?= base_url('admin/roleaccess/'); ?>" + roleId;
        }
    });

});

和我在控制器中的功能:

 public function roleAccess($role_id)
{
    $data['user'] = $this->db->get_where('user', ['nama' => $this->session->userdata('nama')])->row_array();
    $data['title'] = 'Akses Role';

    $data['role'] = $this->db->get_where('user_lv', ['id_lvl' => $role_id])->row_array();

    $this->db->where('id != ', 1);
    $data['menu'] = $this->db->get('user_menu')->result_array();

    $this->load->view('templates/intern_header', $data);
    $this->load->view('templates/sidebar', $data);
    $this->load->view('templates/topbar', $data);
    $this->load->view('admin/role-access', $data);
    $this->load->view('templates/intern_footer');
}

public function changeAccess()
{
    $menu_id = $this->input->post('menuId');
    $role_id = $this->input->post('roleId');

    $data = [
        'id_lvl' => $role_id,
        'menu_id' => $menu_id
    ];

    $result = $this->db->get_where('user_access_menu', $data);

    if ($result->num_rows() < 1) {
        $this->db->insert('user_access_menu', $data);
    } else {
        $this->db->delete('user_access_menu', $data);
    }

    $this->session->set_flashdata('message', '<div class="alert alert-success" role="alert">Akses diganti !</div>');
}

问题是当我尝试检查复选框时,表未更新任何数据(插入/删除)。

我试图找出问题出在什么地方:

  • 它成功触发了onclick函数(因为该页面 选中或取消选中复选框后刷新。
  • 它成功传递了menuId和roleId数据(我通过使用浏览器控制台获得了证明,并在脚本中添加了html响应)

所以,我认为问题出在控制器中的changeAccess函数上,但是我不知道如何解决这个问题,因为我不知道从ajax或其他方式转储数据。

2 个答案:

答案 0 :(得分:0)

old:

url: "<?php base_url('admin/changeAccess'); ?>",

更新:

url: "<?php echo base_url('admin/changeAccess'); ?>",
  

需要回显用于传递数据的网址

答案 1 :(得分:0)

您可以验证

中是否选中了您的复选框
$('.form-check-input').on('click', function() {});

通过添加以下代码段

if($(this).is(":checked")){ }

是否选中基于复选框设置标志,然后将该标志通过ajax传递以从表中插入和删除。