Question

当我使用AJAX更改某些患者的状态时，我需要将<td>显示的值直接更改为从下拉列表中选择的相同值：

$(document).on('change', '#patient_status ', function()
{
    if(confirm("Are you sure you want to change the status of a patient ?"))
    {
        var pid = $(this).closest('tr').attr('id'); 
        var new_status = $("#patient_status").val();
        $(this).closest('tr').find('#change_status').val(new_status);
        //console.log(pid + " " + new_status);
        $.ajax({
            url: '../php/changeStatus.php',
            type: 'POST',
            dataType: 'TEXT',
            data: {pid: pid, new_status: new_status},
            beforeSend:function(){ 
                $('#wait').show(); 
            },
            success:function(resp){

            },
            error:function(resp){

            },
            complete:function()
            {
                $('#wait').hide(); 
            }
        })
    }
});

下图显示了一个示例，其中我将患者的状态从活动状态更改为默认状态，数值在数据库中更改，但在屏幕上我需要重新加载页面。

我认为错误就在这一行：

$(this).closest('tr').find('#change_status').val(new_status);

html表单在这里：

<tr id="<?php echo $patient['patient_id']; ?>">
<td id="change_status"><?php echo $patient['patient_status']; ?></td>
<tr>

Answer 1

在ajax成功之后你可以这样做：

success:function(resp){
$('#td _id').html(change_status_value);// just a demo 
            },

Answer 2

首先使用class而不是id来表示多个元素例如：<td class="change_status">

其次使用
的 $(this).html(new_status);
而不是的 $(this).closest('tr').find('#change_status').val(new_status);

更新td的值而无需重新加载页面

2 个答案: