Question

我有一张表，该表显示了用户的所有工作经验数据。我想做的是单击行后获取的数据值，但是我似乎无法尝试使用不同的样式。

我尝试了data（'key'），但仍然无法正常工作。我尝试将其放在属性中，但仅返回未定义。

这是我的HTML代码

<table class="m-datatable" id="applicant_work_tbl" width="100%">
    <thead>
        <tr>
            <th title="Field #1" data-field="From">From</th>
            <th title="Field #2" data-field="To">To</th>
            <th title="Field #3" data-field="Employer">Employer</th>
            <th title="Field #4" data-field="Location">Location</th>
            <th title="Field #5" data-field="JobTitle">Job Title</th>
            <th title="Field #6" data-field="JobDescription">Job Description</th>
            <th title="Field #7" data-field="Certificate">Certificate</th>
            <th title="Field #8" data-field="Actions">Actions</th>
        </tr>
    </thead>
    <tbody id="work_tbody">
        <?php foreach ($work as $work) { ?>
            <tr class="work_row">
                <td class="td-from"><?php echo $work->from_date; ?></td>
                <td><?php echo $work->to_date; ?></td>
                <td><?php echo $work->company; ?></td>
                <td><?php echo $work->location; ?></td>
                <td><?php echo $work->job_title; ?></td>
                <td><?php echo $work->job_description; ?></td>
                <td><a target="_blank" href="<?php echo base_url().$work->attachment;?>">Certificate</a></td>
                <td id="work_id" data-key="<?php echo $work->experience_id; ?>"><button class="btn btn-brand btn-sm"><i class="fa fa-eye"></i> View</button></td>
            </tr>
        <?php } ?>
    </tbody>
</table>

这是我在javascript中的代码：

$('#applicant_work_tbl').on('click', '.work_row', function(){
    var from = $(this).find('td:nth-child(1)').text();
    var to = $(this).find('td:nth-child(2)').text();
    var company = $(this).find('td:nth-child(3)').text();
    var location = $(this).find('td:nth-child(4)').text();
    var job_title = $(this).find('td:nth-child(5)').text();
    var job_description = $(this).find('td:nth-child(6)').text();
    var attachment = $(this).find('td:nth-child(7)').text();
    var idx = $(this).find('td:nth-child(8)').data('key');

    console.log(idx);

    $('#modal_experience_id').val(idx);
    $('#modal_experience_employer').val(company);
    $('#modal_experience_from_date').val(from);
    $('#modal_experience_to_date').val(to);
    $('#modal_experience_job_title').val(location);
    $('#modal_experience_location').val(job_title);
    $('#modal_experience_job_description_summary').val(job_description);
    $('#modal_image_file').text(attachment);
    $('#work_modal').modal('toggle');
});

我想使用data属性获取该行的ID，但无法使用此方法获取它。我希望你们能帮助我。谢谢。

更新我想到了。每当数据表初始化时，我在表单元格中定义的属性都会丢失。我所做的是我在按钮图标或按钮中转移了属性。感谢您的帮助！

获取表格单元格数据

0 个答案: