ページをリロードせずにtdの値を更新する

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

アヤックス成功の後、あなたはこのように行うことができます：まず

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

Answer 2

私はエラーがこの行であると思います複数の要素に対してidの代わりにclassを使用する
例：<td class="change_status">

第二に、あなたが同じ `id`を持つ複数の要素を持っていますか
$(this).html(new_status);
代わり $(this).closest('tr').find('#change_status').val(new_status);