Finde den nächsten Wert von Div innerhalb der Zeile

Question

Ich versuche, den Wert aus einem Formular innerhalb angeklickt Zeilenform zu finden. Ich benutze dieses Skript. Ich kann den Wert aus dem Formularfeld abrufen. Aber es gibt mir den gleichen Wert und es gibt mir nur Wert von der ersten Reihe, wenn ich irgendeine Reihe anklicke.

Ich möchte das Formular beim Klicken auf td Link innerhalb der Zeile mit dem Klassennamen ".Followupform" öffnen nach dem Öffnen ".followupform" Link (Formular). Ich möchte den Wert von Feldern erhalten, indem ich auf ".updatefollowupstatus" der aktuellen Zeile klicke.

$(".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> 

Ich habe alle möglichen Wege verwendet. aber ich denke, es gibt einen Fehler oder eine andere Möglichkeit, das zu tun. Mein Ziel ist es, das Feedback der aktuellen Zeile zu aktualisieren und den Wert über Ajax an den Prozess zu senden.

Answer 1

Besser die .parents() Methode zu verwenden, da Formular das übergeordnete Element der Schaltfläche ist, auf die geklickt wird.

Versuchen Sie folgenden Code.

$(".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

Sie verwenden falsche Wähler in .closest('td>.popover-content>form') in [am nächsten()] [1], benutzen Sie einfach .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>