使用Javascript按鈕提交數據與按鈕使用的按鈕

Question

我有一個動態的記錄列表，我在一個表中顯示，每行有兩個按鈕，一個將用戶訪問一個頁面來查看/編輯數據，另一個用於刪除行項目。

我想弄清楚的是，如果選擇任一按鈕時，如何創建javascript以僅爲該行提供lead_id隱藏值。

我明白如何從帶有js的命名元素的單個結果中提取值，只理解如何從單擊按鈕的行檢索單個結果的問題。

下面是HTML：

<table id="lead_list" width="100%"> 

     <th> 
    <tr> 
     <td><strong>Date</strong></td> 
     <td><strong>First Name</strong></td> 
     <td><strong>Last Name</strong></td> 
     <td><strong>Email</strong></td> 
     <td><strong>Company</strong></td> 
     <td><strong>Lead Status</strong></td> 
     <td><strong>Actions</strong></td> 
    </tr> 
     </th> 
    <tr> 
     <td>2014-03-06</td> 
     <td>Bob</td> 
     <td>Wilson</td> 
     <td><a href="mailto:test@test.com">test@test.com</a></td> 
     <td>MyFunLIFE</td> 
     <td>Subscribed</td> 
     <td><input type="hidden" name="lead_id" value="379" /> 
      <input type="button" class="view-edit-lead" value="View/Edit" /> 
      <input type="button" class="delete-lead" value="Delete" /></td> 
    </tr> 
    <tr> 
     <td>2014-03-06</td> 
     <td>Tom</td> 
     <td>Shuemate</td> 
     <td><a href="mailto:test@test.com">test@test.com</a></td> 
     <td>MyFunLIFE</td> 
     <td>Subscribed</td> 
     <td><input type="hidden" name="lead_id" value="377" /> 
      <input type="button" class="view-edit-lead" value="View/Edit" /> 
      <input type="button" class="delete-lead" value="Delete" /></td> 
    </tr> 
    <tr> 
     <td>2014-03-06</td> 
     <td>Biggie</td> 
     <td>Smalls</td> 
     <td><a href="mailto:test@test.com">test@test.com</a></td> 
     <td>MyFunLIFE</td> 
     <td>Subscribed</td> 
     <td><input type="hidden" name="lead_id" value="376" /> 
      <input type="button" class="view-edit-lead" value="View/Edit" /> 
      <input type="button" class="delete-lead" value="Delete" /></td> 
    </tr> 
</table> 

這是當前JS我使用這個：

$('td.wplp-inputs input').click(function(){ 

// Don't allow access to the page while we process data. 
$.blockUI({ 

    message: '<h1>Just a moment</h1><br /><br />Lead is being deleted...', 
    css: { 
     top: ($(window).height() - 400) /2 + 'px', 
     left: ($(window).width() - 400) /2 + 'px', 
     width: '400px', 
     Height: '250px', 
     padding: '10px' 
    } 

    });  


// if the button class is 
if($(this).is('.delete-lead')) { 
    /// delete 
    data = new Object(); 
    data.lead_id = $(this).siblings('input[type="hidden"]').val(); 

    alert(JSON.stringify(data));   

    data.action = "delete_lead"; //the action to call 
    data._ajax_nonce = wplpajaxobjfront.nonce; // This is the name of the nonce setup in the localize_script 
    data.ajaxUsed = "yes"; 

    // Define the URL for the AJAX to call 
    var url = wplpajaxobjfront.ajaxurl; 

    //alert(JSON.stringify(data)); 
    //alert(JSON.stringify(url)); 

    $.post(url, data, function(response) { 

     alert(response); 
     window.location.reload(); 
     //window.location.href = response; 
     $.unblockUI(); 
     //window.open(response,"_blank","",""); 

    }); 

} else { 
    /// edit/view 

    alert(reponse); 

} 

return false; //Do not remove! 

}）;

一旦我有從單個錶行中提取數據的方法，特別是lead_id，我將能夠將它傳遞給我的PHP函數，而不會出現問題。

js的問題還沒有讓其他值傳遞給var數據，當前從ajax調用返回的唯一項目是沒有輸入名稱的lead_id，對於data.action，data.ajaxUsed和data._ajax_nonce等。

在此先感謝您的幫助。

Answer 1

這裏有一個簡單的方法來獲取每行lead_id值當點擊鏈接

$('td input').click(function(){ 
    var el = $(this).siblings('input[type="hidden"]'); 

    // to get input name 
    var data = {}; /// create new object 
    data[el.attr('name')] = el.val() ; // lead_id to data 
    data['action'] = 'delete_lead'; // add action to data 
    console.log(data);     // log data to check, open your console and see data 

    if($(this).is('.delete-lead')) { 
     /// delete 
    } else { 
     /// edit/view 
    } 
});