用動態表格數據填充對話框表單字段onclick jquery按鈕

Question

我以前沒有在這裏發過一個問題，但是這個網站一直很有幫助，所以謝謝。當我點擊與我想要用來填充表單的字段相同的行中的「編輯」按鈕時，我一直在使用動態表格數據填充jQuery對話框。

我的HTML代碼在這裏： 對話形式：

<div id="edit-dialog-form" class="edit-dialog-form" title="Edit Subscriber"><!--EDIT SUBSCRIBER - PULL FROM DB & UPDATE TO DB--> 

      <form name="editSubscriber"><!--edit existing subscriber details in database---> 
      <fieldset> 
       <label for="fname">First Name</label> 
       <input type="text" name="fname" id="fnameEdit" value="" class="text ui-widget-content ui-corner-all"/> 

       <label for="lname">Last Name</label> 
       <input type="text" name="lname" id="lnameEdit" value="" class="text ui-widget-content ui-corner-all" /> 

       <label for="email">Email</label> 
       <input type="text" name="email" id="emailEdit" value="" class="text ui-widget-content ui-corner-all" /> 

       <label for="status">Status</label> 
       <input type="text" name="status" id="statusEdit" value="" class="text ui-widget-content ui-corner-all" /> 

       <!--<label for="password">Password</label> 
       <input type="text" name="password" id="password" value="" class="text ui-widget-content ui-corner-all" />--> 

      </fieldset> 
      </form> 
     </div><!-- create - dialog-form--> 

HTML表

<table id="users" class="ui-widget ui-widget-content"> 
      <thead> 
      <tr class="ui-widget-header "> 
       <th>First Name</th> 
       <th>Last Name</th> 
       <th>Email</th> 
       <th>Status</th> 
       <th>Edit</th> 
      </tr> 
      </thead> 
      <tbody> 

      <?php 

      $content = $sub_info; 


       foreach($content as $row) 
       { 
        //print_r($row); 
        echo '<tr>'; 
        echo '<td data-fn="'.$row['SubFirstName'].'" >'.$row['SubFirstName'].'</td>'; 
        echo '<td data-ln="'.$row['SubLastName'].'">'.$row['SubLastName'].'</td>'; 
        echo '<td data-em="'.$row['SubEmail'].'">'.$row['SubEmail'].'</td>'; 
        echo '<td data-st="'.$row['Activated'].'">'.$row['Activated'].'</td>'; 
        echo '<td><input type="button" class="editUser" id="editUser" value="Edit"/></td>'; 
        echo '</tr>'; 
       } 
      ?> 

      </tbody> 
     </table> 

我的JS代碼在這裏：

$(".editUser").click(function(){ 
       $(".edit-dialog-form").dialog("open"); 

       //get the data-xx values from this tr 
       var fname = $(this).closest('tr').find('td').data('fn');//data-fn="'.$row[SubFirstName].'" 
       // put each into the form 
       $('#fnameEdit').val(fname);//where #fnameEdit is the id of input field form "editSubscriber" 

       //get the data-xx values from this tr// 
       var lname = $(this).closest('tr').find('td').data('ln'); 
       // put each into the form 
       $('#lnameEdit').val(lname);//where #lnameEdit is the id of input field form "editSubscriber" 
     }); 

我希望我張貼這在正確的辦法。 感謝任何能夠提供幫助的人。 基本上我的表中填充了來自數據庫的動態數據，當我點擊編輯按鈕時，我需要在窗體中顯示這些數據 - 這樣我才能最終編輯數據並將編輯的數據更新到數據庫。現在我的「填充表單js」現在只是第一個字段（fname）正在從表格中拉出並填充第一個表單字段。

Answer 1

var fname = $(this).closest('tr').find('td').data('fn'); 

猜測它應該是

var fname = $(this).closest('tr').find('td:eq(0)').data('fn');//data-fn 

和

var lname = $(this).closest('tr').find('td').data('ln'); 

應該

var lname = $(this).closest('tr').find('td:eq(1)').data('ln');