简体   繁体   English

如何从行中的下拉列表中单击的jQuery数据表中的单元格获取值

[英]How do i get a value from a cell in jquery datatables clicking on dropdown inside a row

I have a dynamically created datatable using jQuery data tables with serverside processing with ajax and JSON. 我有一个动态创建的数据表,该表使用jQuery数据表以及带有ajax和JSON的服务器端处理。 Actually i figured out how to add a dropdown to each row using mRender. 实际上,我想出了如何使用mRender向每行添加一个下拉列表。 Now ich have the next problem. 现在,ich有了下一个问题。 If the user click on one off the dropdown options like "edit" i need 如果用户单击“编辑”之类的下拉选项,则需要

  1. to get the value of "ID" from id row in wich the dropdown is in and 从下拉列表中的id行获取“ ID”的值,并且
  2. pass it to a servlet 将其传递给servlet

How can i do this? 我怎样才能做到这一点? And how can I add a eventlistener to my dropdown buttons? 以及如何在下拉按钮中添加事件监听器? (Sorry, I'am new in jQuery and JS) (对不起,我是jQuery和JS的新手)

This is the code of datatable 这是数据表的代码

<script type="text/javascript">
 $(document).ready(function(){
     var ctx = "${pageContext.request.contextPath}";
     var oTable = $('#usertable').dataTable(
             {"processing":true,
             sAjaxDataProp: "",
                 "ajax": {
                     "url": ctx+"/fetchuser",`
                     "type": "GET"       
                 },
     "aoColumns": [
    { "mData": "id" },
    { "mData": "senderFullName" },
    { "mData":"userName" },
    { "mData": "userLastLogin" },
    { "mRender": 
        function(data, type, full) {
    return '<div class="dropdown">'+'<button class="btn btn-default dropdown-toggle" type="button"data-toggle="dropdown">Actions'+
    '<span class="caret"></span></button>'+
        '<ul class="dropdown-menu">'+
            '<li><a href="#">Edit</a></li>'+
            '<li><a href="#">Delete</a></li>'+
            '<li><a href="#">Block</a></li>'+
        '</ul>'+
    '</div>'
    },"bSortable" : false }
    ]
             }); 
 });
 </script>

Thanks 谢谢

EDIT: Screenshot of errors 编辑:错误的屏幕截图 错误的屏幕截图

The first error is, when i try to get the id of mixed characters (unique id) and the second if i try to get a test id containing only one number like "1" 第一个错误是,当我尝试获取混合字符的ID(唯一ID)时,第二个错误是,当我尝试获取仅包含一个数字(例如“ 1”)的测试ID时

EDIT: 编辑: 新错误

I think you can try like this. 我想你可以这样尝试。

<li><a href="#" onclick="return Edit('+full.id+')">Edit</a></li>

And than write javascript function like this 而且比写这样的JavaScript函数

function Edit(id) //here you will get id of your row
{
   //here is your ajax call for servlet or any other code
}

Try this one : 试试这个:

<script type="text/javascript">
  $(document).ready(function(){
  var ctx = "${pageContext.request.contextPath}";
  var oTable = $('#usertable').dataTable(
         {"processing":true,
         sAjaxDataProp: "",
             "ajax": {
                 "url": ctx+"/fetchuser",`
                 "type": "GET"       
             },
 "aoColumns": [
{ "mData": "id" },
{ "mData": "senderFullName" },
{ "mData":"userName" },
{ "mData": "userLastLogin" },
{ "mRender": 
    function(data, type, full) {
return '<div class="dropdown">'+'<button class="btn btn-default dropdown-toggle" type="button"data-toggle="dropdown">Actions'+
'<span class="caret"></span></button>'+
    '<ul class="dropdown-menu">'+
        '<li><a href="#" onclick="return Edit('+full.id+')">Edit</a></li>'+
        '<li><a href="#">Delete</a></li>'+
        '<li><a href="#">Block</a></li>'+
    '</ul>'+
'</div>'
},"bSortable" : false }
]
         }); 
});

function Edit(id) //here you will get id of your row
{
    console.log(id);
   //here is your ajax call for servlet or any other code
}
</script>

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM