DataTables jquery 识别行 ID

发布于 2024-10-09 17:52:05 字数 590 浏览 1 评论 0原文

我正在使用 DataTables 并捕获 img 单击编辑或删除图标。我的问题是，我还需要捕获行 ID..我尝试将行 ID 放入 href 标记中，但 npt 能够提取它..

当前的代码是

 $('#datatable tbody tr a.delete img').live( 'click', function (e) {
 var rowID = $('a').attr('href');
 alert(rowID);

     if (!fancyConfirm(rowID, "Are you sure you want to delete this record?", function(ret) { alert(rowID) })) 
          e.preventDefault();

     });

您可以在 http://www(@)fisheragservice(@)com/tm/users(@)html 请将 (@) 替换为 .，因为该页面包含实际的电子邮件地址，我不想让 spma 机器人找到。

原文

I am using DataTables and capturing am img click on either edit or delete icon's. My problem is, I need to capture the row ID as well.. I tried putting the row ID in the href tag but npt able to extract it..

The current code is

 $('#datatable tbody tr a.delete img').live( 'click', function (e) {
 var rowID = $('a').attr('href');
 alert(rowID);

     if (!fancyConfirm(rowID, "Are you sure you want to delete this record?", function(ret) { alert(rowID) })) 
          e.preventDefault();

     });

You can see the actual page at http://www(@)fisheragservice(@)com/tm/users(@)html
Please replace the (@)'s with .'s because the page contans actual email addresses I rather not have a spma bot find..

分享到QQ

分享到微博

如果你对这篇内容有疑问，欢迎到本站社区发帖提问参与讨论，获取更多帮助，或者扫码二维码加入 Web 技术交流群。

发布评论

需要登录才能够评论，你可以免费注册一个本站的账号。

梦毁影碎の 2024-10-16 17:52:05

难道您不能只在链接上附加 click 事件而不是其中的 img 事件，然后使用 this 吗？

 $('#datatable tbody tr a.delete').live( 'click', function (e) {
 var rowID = $(this).attr('href');
 alert(rowID);

 if (!fancyConfirm(rowID, "Are you sure you want to delete this record?", function(ret) { alert(rowID) })) 
      e.preventDefault();

 });

示例链接

Can't you just attach the click event on the link instead of the img inside it and then use this?

 $('#datatable tbody tr a.delete').live( 'click', function (e) {
 var rowID = $(this).attr('href');
 alert(rowID);

 if (!fancyConfirm(rowID, "Are you sure you want to delete this record?", function(ret) { alert(rowID) })) 
      e.preventDefault();

 });

Example link

回复收藏 0 原文

温柔戏命师 2024-10-16 17:52:05

您需要使用 $('a') 选择所有锚点来获取 rowID。那是行不通的。而是在点击处理程序中使用parent().attr() 函数。 IE：

$('#datatable tbody tr a.delete img').live( 'click', function (e) {
 var rowID = $(this).parent().attr('href');
 alert(rowID);

     if (!fancyConfirm(rowID, "Are you sure you want to delete this record?", function(ret) { alert(rowID) })) 
          e.preventDefault();

     });

You care selecting all the anchors using $('a') to get the rowID. That will not work. Instead use the parent().attr() function in the click handler. i.e.:

$('#datatable tbody tr a.delete img').live( 'click', function (e) {
 var rowID = $(this).parent().attr('href');
 alert(rowID);

     if (!fancyConfirm(rowID, "Are you sure you want to delete this record?", function(ret) { alert(rowID) })) 
          e.preventDefault();

     });

回复收藏 0 原文

沦落红尘 2024-10-16 17:52:05

我不确定您是否正在寻找实际的表行，或者该行
有一些有意义的信息，例如数据库密钥。

如果您确实在查看行 ID，请考虑下面的示例，其中
使用 fnRender 属性。

var oTable = $('#inventory_list').dataTable ({
'bServerSide'    : true,
'bAutoWidth'     : false,
'bJQueryUI'      : false,
'sPaginationType': 'full_numbers',
'sAjaxSource'    : '/inventory/listall',
'aoColumns'      : 
[
{
  'bSearchable': false,
        "bSortable": false,
        "fnRender" : function ( oObj )
        {
          var colval = '<div class="editcol"><a href="/inventory/edit/'  +
                oObj.aData[0] + '">' + 
                '<img src="/img/edit.png" alt="edit"><a/>' +
                '<a href="/inventory/delete/' + oObj.aData[0] + '">' +
                '<img src="/img/delete.png" alt="delete"><a/>' +
                '</div>';

                return colval;
        }
},
null,
null,
null,
null,
null,
null,
null,
null,
null
]
});

第一列（共 10 列）包含编辑/删除图标。

对服务器的 listall 调用返回第一个中的库存 id
cell，由 oObj.aData[0] 引用，用于构建 URL。

I am unsure if you are looking for the actual table row, or if the row
has some meaningful information like a database key.

if you indeed looking at a row id, consider the example below, which
uses the fnRender attribute.

var oTable = $('#inventory_list').dataTable ({
'bServerSide'    : true,
'bAutoWidth'     : false,
'bJQueryUI'      : false,
'sPaginationType': 'full_numbers',
'sAjaxSource'    : '/inventory/listall',
'aoColumns'      : 
[
{
  'bSearchable': false,
        "bSortable": false,
        "fnRender" : function ( oObj )
        {
          var colval = '<div class="editcol"><a href="/inventory/edit/'  +
                oObj.aData[0] + '">' + 
                '<img src="/img/edit.png" alt="edit"><a/>' +
                '<a href="/inventory/delete/' + oObj.aData[0] + '">' +
                '<img src="/img/delete.png" alt="delete"><a/>' +
                '</div>';

                return colval;
        }
},
null,
null,
null,
null,
null,
null,
null,
null,
null
]
});

The first column (out of 10) contains the edit/delete icons.

The listall call to the server return the inventory id in the first
cell, which is referenced by oObj.aData[0], ans used to build the URL.

回复收藏 0 原文

~没有更多了~