CodeIgniter中点击按钮如何获取对应行textarea的内容？

问题根源 #

你的代码存在两个核心问题导致每次都取到第一行的备注：

• 所有textarea没有设置唯一标识，若你全局存在一个id="remarks"的元素，document.getElementById("remarks")只会返回页面中第一个匹配的元素，永远拿不到其他行的输入内容
• 没有将提交按钮和对应行的输入框做关联，获取值时没有限定范围为当前点击的行

解决方案 #

方案1：通过DOM层级关联当前行的输入框（推荐，无需修改textarea代码） #

1. 修改a标签的onclick事件，将当前点击的元素本身传入函数：

<a onclick="update_remarks(this, '+data.sub_ordinates[i].staff_id+')">Submit</a>

2. 修改update_remarks函数，限定取值范围为当前按钮所在行：

function update_remarks(el, staff_id){
    // 找到当前点击按钮所在的行
    const currentRow = el.closest('tr');
    // 获取当前行内的textarea输入值
    const remarks = currentRow.querySelector('textarea').value;

    $.post('<?php echo base_url(); ?>index.php/regionalzonemanager/regionalzonemanager/delete_staff_lock',{staff_id:staff_id, remarks:remarks},function(data){
        if(data.status==1){
            alert(data.msg);
        }
    },'json');
}

方案2：为每个textarea设置唯一id关联staff_id #

1. 渲染表格时，给每一行的textarea设置带staff_id的唯一id：

<textarea id="remarks_{{data.sub_ordinates[i].staff_id}}"></textarea>

2. 修改update_remarks函数，按对应id取值：

function update_remarks(staff_id){
    const remarks = document.getElementById("remarks_" + staff_id).value;

    $.post('<?php echo base_url(); ?>index.php/regionalzonemanager/regionalzonemanager/delete_staff_lock',{staff_id:staff_id, remarks:remarks},function(data){
        if(data.status==1){
            alert(data.msg);
        }
    },'json');
}

内容的提问来源于stack exchange，提问作者annadev