使用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:[email protected]">[email protected]</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:[email protected]">[email protected]</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:[email protected]">[email protected]</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 
    } 
});