如何禁用/启用数据表中的按钮

Question

我想检查文章的状态，如果 true Edit 按钮将被禁用，否则用户可以单击并切换到 Edit 页面。如何使用？

                    return '<a href="Student/EditArticle/' + data + '" class="btn btn-success mr-1"> Edit </a>';
                }}
        ],
        order: [1, 'asc']
    });

Answer 1

您正在使用的列渲染函数：

render: function (data) { ... }

能够访问当前行中的所有数据。它的完整签名是：

render: function ( data, type, row, meta ) { ... }

因此，您可以使用 row 参数访问该行中的其他列，例如 row.status:

{
  data: 'id',
  className: "center",
  title: 'Actions',
  render: function (data, type, row, meta) {
    if (row.status === true) {
      return '<a href="Student/EditArticle/' + data + '" class="btn btn-success mr-1"> Edit </a>';
    } else {
      return '<a href="Student/EditArticle/' + data + '" class="btn btn-success mr-1" disabled> Edit </a>';
    }
  }
}

您可以查看更多详细信息和示例 here。

值得一看的是为什么提供type参数以及如何使用它。它基本上可以帮助您提供多个版本的值 - table 显示的一个值（HTML link）；不同的排序值；过滤的另一个值，依此类推。

因此，例如，对于可点击的 link，您可能希望排序和筛选值只是 data 值（没有任何无关的 HTML）。

但这完全是可选的 - 您不必使用它。有关详细信息，请参阅 orthogonal data。

更新：

我忘记了 hyperlink 不能像按钮一样被禁用（所以你不能使用“禁用”）。相反，您可以查看 these approaches，或按照 TimRoberts 在问题评论中的建议进行操作。话说回来，带row参数的render函数应该就是你需要的了。

else {
  return 'Edit'; // or, alternatively: return ''
}

如何禁用/启用数据表中的按钮

how to Disable / Enable button in datatable

javascript

ajax

jquery

datatables