從行內找到最接近的值

Question

我試圖從點擊的行窗體中找到表單中的值。我正在使用這個腳本。我能夠從表單字段中獲得價值。但它給了我相同的價值，它只是從第一行給我的價值，如果點擊任何行。

我想打開表單上的類名爲「.followupform」的td鏈接點擊後打開「.followupform」鏈接（表單）。我想通過點擊當前行的「.updatefollowupstatus」來從字段中獲取值。

$(".updatefollowupstatus").click(function(e){ 
    var row = $(this).closest('td>.popover-content>form') 
    var status= $(row).find(".fformstatus").val(); 
    var comment= $(row).find(".fformcomment").val(); 
    var ffid= $(row).find(".fformffid").val(); 
    alert(ffid); 
}); 


    <td style="text-align:center"> 
        <a href="#" class="followupform"><i class="fa fa-edit"></i></a>       <div class="hide img-rounded popover-content"> 
        <strong style="text-align:center">Update Followup Status</strong><span class="pull-right ffclose" style="cursor: pointer;"><i class="fa fa-close"></i></span> 
        <hr> 
         <form class="form-inline" role="form"> 
         <div class="form-group"> 
          <select class="form-control fformstatus" name="fformstatus"> 
          <option value="0">Followups Status</option> 
          <option value="VM">VM</option> 
          <option value="Callback">Callback</option> 
          <option value="Rude">Rude</option> 
          <option value="Done">Done</option> 
          </select>   
         </div> 
         <div class="form-group"> 
          <textarea placeholder="Follow up Comment overview" class="form-control fformcomment"></textarea> 
          <input type="text" class="fformffid" hidden="" name="fformffid" value="15"> 
         </div>   
         <div class="form-group"> 
          <div class="btn btn-primary updatefollowupstatus">Update »</div>         
         </div> 
         </form> 
</div><!-- Form Content --> 
        </td> 

我用了所有可能的方法。但我認爲有一些錯誤或其他方式可以做到這一點。我的目標是更新當前行的反饋並通過ajax發送值進行處理。

Answer 1

更好使用.parents()方法，因爲form是被點擊的按鈕的父元素。

請嘗試下面的代碼。

$(".updatefollowupstatus").click(function(e){ 
    var frm = $(this).parents('form'); 
    var status= $(frm).find(".fformstatus").val(); 
    var comment= $(frm).find(".fformcomment").val(); 
    var ffid= $(frm).find(".fformffid").val(); 
    alert(ffid); 
}); 

Answer 2

您在.closest('td>.popover-content>form')使用錯誤的選擇[最接近（）[1]，只是用.closest('form')，

$(".updatefollowupstatus").click(function(e) { 
 
    var row = $(this).closest('form'); 
 
    var status = $(row).find(".fformstatus").val(); 
 
    var comment = $(row).find(".fformcomment").val(); 
 
    var ffid = $(row).find(".fformffid").val(); 
 
    alert(status + ',' + comment + ',' + ffid); 
 
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script> 
 
<table> 
 
    <tr> 
 
    <td style="text-align:center"> 
 
     <a href="#" class="followupform"><i class="fa fa-edit"></i></a> 
 
     <div class="hide img-rounded popover-content"> 
 
     <strong style="text-align:center">Update Followup Status</strong><span class="pull-right ffclose" style="cursor: pointer;"><i class="fa fa-close"></i></span> 
 
     <hr> 
 
     <form class="form-inline" role="form"> 
 
      <div class="form-group"> 
 
      <select class="form-control fformstatus" name="fformstatus"> 
 
       <option value="0">Followups Status</option> 
 
       <option value="VM">VM</option> 
 
       <option value="Callback">Callback</option> 
 
       <option value="Rude">Rude</option> 
 
       <option value="Done">Done</option> 
 
      </select> 
 
      </div> 
 
      <div class="form-group"> 
 
      <textarea placeholder="Follow up Comment overview" class="form-control fformcomment"></textarea> 
 
      <input type="text" class="fformffid" hidden="" name="fformffid" value="15"> 
 
      </div> 
 
      <div class="form-group"> 
 
      <div class="btn btn-primary updatefollowupstatus">Update »</div> 
 
      </div> 
 
     </form> 
 
     </div> 
 
     <!-- Form Content --> 
 
    </td> 
 
    </tr> 
 
    <tr> 
 
    <td style="text-align:center"> 
 
     <a href="#" class="followupform"><i class="fa fa-edit"></i></a> 
 
     <div class="hide img-rounded popover-content"> 
 
     <strong style="text-align:center">Update Followup Status</strong><span class="pull-right ffclose" style="cursor: pointer;"><i class="fa fa-close"></i></span> 
 
     <hr> 
 
     <form class="form-inline" role="form"> 
 
      <div class="form-group"> 
 
      <select class="form-control fformstatus" name="fformstatus"> 
 
       <option value="0">Followups Status</option> 
 
       <option value="VM">VM</option> 
 
       <option value="Callback">Callback</option> 
 
       <option value="Rude">Rude</option> 
 
       <option value="Done">Done</option> 
 
      </select> 
 
      </div> 
 
      <div class="form-group"> 
 
      <textarea placeholder="Follow up Comment overview" class="form-control fformcomment"></textarea> 
 
      <input type="text" class="fformffid" hidden="" name="fformffid" value="16"> 
 
      </div> 
 
      <div class="form-group"> 
 
      <div class="btn btn-primary updatefollowupstatus">Update »</div> 
 
      </div> 
 
     </form> 
 
     </div> 
 
     <!-- Form Content --> 
 
    </td> 
 
    </tr> 
 
</table>