2016-04-28 96 views
0

編輯訪問特定TD的內容,但無法改變其內容

<table class="table table-hover" id="patient_name_table"> 
       <tr id="after_tr_2"> 
        <th>Patient</th> 
        <th>Phone</th> 
        <th>D.O.B</th> 
        <th>Address</th> 
        <th>Edit</th> 
       </tr> 
       <tbody> 
        <?php foreach($name_array as $tabName) { ?> 
        <tr id="<?php echo $tabName['id']; ?>"> 
        <td class="nameid"><?php echo '<a href="patients.php?patient='.$tabName['id'].'">'.$tabName['patient_name'].'</a>';?></a> 
        </td> 
        <td class="phoneid"><?php echo $tabName['phone']?></td> 
        <td class="dobid"><?php echo $tabName['dob']?></td> 
        <td class="addressid"><?php echo $tabName['patient_address']?></td> 
        <td><button type="button" class="btn btn-info" id="editInfo">Edit</button> 
        </tr> 
        <?php } ?> 
       </tbody> 
       </table> 

這裏是更新形式:

<div class="box" id="dialog" title="Update Patient Informations" style="display:none"> 
        <form class="form-horizontal" id="add_app_form"> 
        <table class="table table-striped table-hover" style="width:650px;"> 
         <tr><th style="text-align:left;width:150px">Patient Name:</th> <td><input type="text" class="form-control" id="name_upd"></td></tr> 
         <tr><th style="text-align:left;width:150px">Phone:</th> <td><input type="text" class="form-control" id="phone_upd"></td></tr> 
         <tr><th style="text-align:left;width:150px">D.O.B:</th><td><input type="text" class="form-control" id="dob_upd"></td></tr> 
         <tr><th style="text-align:left;width:150px">Address:</th> <td><input type="text" class="form-control" id="address_upd"></td></tr> 
        <tr><td colspan="3"><button type="button" id="upd_info" class="btn btn-info pull-right">Update</button></td></tr> 
        <table> 
       </form> 
       </div> 

我有這條線,我得到的ID在我的表中的特定行:

var id = $(this).closest('tr').attr('id'); 

現在,我需要得到一個指定從這個tr C產品介紹,並從名字td有一個class=nameid,使用該行:

var x = $(this).parent('td').parent('tr').children('td.nameid').text(); 

現在的問題是,我無法訪問x改變它的價值爲內一個新的AJAX調用的成功功能。

這裏是Ajax調用:

$("#upd_info").on('click', function() 
     { 
     var upd_name = $("#name_upd").val(); 
     var upd_dob = $("#dob_upd").val(); 
     var upd_phone = $("#phone_upd").val(); 
     var upd_address = $("#address_upd").val(); 
     $.ajax({ 
      url: 'upd_patient.php', 
      data: {upd_id: id, n: upd_name, d: upd_dob, p:upd_phone, a:upd_address}, 
      type: 'POST', 
      dataType: 'JSON', 

      success:function(res3) 
      { 
      $("#dialog").dialog("close"); 
      //here I need to access td of class nameid and change the value 
      }, 
      error:function(res3) 
      { 
      console.log("Error Updating info"); 
      } 
     }); 

是他們一條出路?

回答

0

文本將從其中返回文本,而不是文本的訪問者。請嘗試將x作爲$(this).parent('td').parent('tr').children('td.nameid'),並與x.text()獲取文本,然後用x.text('new text')

0

success回調設置它有自己的this。您應該在ajax調用之前獲得.nameid的引用,並像success那樣更改文本。

$("#upd_info").on('click', function(){ 
    var upd_name = $("#name_upd").val(); 
    var upd_dob = $("#dob_upd").val(); 
    var upd_phone = $("#phone_upd").val(); 
    var upd_address = $("#address_upd").val(); 

    //added following line 
    var x = $(this).closest('tr').find('td.nameid'); 

    $.ajax({ 
     url: 'upd_patient.php', 
     data: { upd_id: id, n: upd_name, d: upd_dob, p: upd_phone, a: upd_address }, 
     type: 'POST', 
     dataType: 'JSON', 

     success: function(res3) { 
      $("#dialog").dialog("close"); 

      //added following line 
      x.text('changed text'); 
     }, 
     error: function(res3) { 
      console.log("Error Updating info"); 
     } 
    }); 
}); 
+0

nope,它沒有工作,沒有改變 – androidnation

+0

您的元素是否動態生成? @androidnation – Azim

+0

是的,這個表是用PHP生成的,它從db獲得值,並且每行都有一個特定的ID – androidnation