jQuery DataTables 渲染列数据

2023-11-26

我正在使用 jQuery DataTables 显示来自 JSON 编码的 PHP 响应的信息。 JSON 响应包含对象“名称”。 “姓名”包含“全名”、“姓氏”、“ID”。我一直在使用columns以我想要的方式显示数据,但是我遇到了一个我无法弄清楚的问题。

在下面的代码中,示例 1 工作正常,并且在按“姓氏”排序时会显示“全名”。然而,示例 2 根本不起作用。所需的输出将包含 HTML 渲染显示并按“姓氏”排序。在示例 3 中,显示按照我想要的方式呈现,但排序不正确。

有谁知道如何调整示例 2 以输出我正在寻找的内容(渲染和排序的数据)?

var oTable = $('#table').DataTable({
'ajax': {
    url: 'PHP-file-returns-JSON.php',
    type: "POST",
    dataSrc: function ( data ) {
            return data.cols;
        },       
    data: function(d) {

       ///send additional values to POST
       var frm_data = $('#val1, #val2').serializeArray();
       $.each(frm_data, function(key, val) {
             d[val.name] = val.value;
       });
     }
},
'columns':[

        // exapmle 1 - works but not rendered with HTML
        { data: {
                _:    "name.Full Name",
                sort: "name.Last Name",
                } 
        },

        // example 2 not working at all
        { data: 'name', "render": function ( data, type, row ) {
                return '<span id="'+data.ID+'">'+data.Full Name+'</span>';
            },
            "sort" : "name.Last Name",
        },

        // example 3 works fine with HTML rendered display but not sorted
        { data: 'name', "render": function ( data, type, row ) {
                return '<span id="'+data.ID+'">'+data.Full Name+'</span>';
            } 
        },
]
});

UPDATE:

HERE是 JSFiddle,它显示了我正在使用的数据结构。工作示例仅显示按姓氏排序的全名。我试图弄清楚如何使显示包含一个以 ID 作为 id 属性的 span 元素。


事实证明使用name.Full Name不管用。它一定要是name.FullName没有空间。这就是最终对我有用的东西。

  'columns': [
        { 
            "data": "name",                   
            "render": function ( data, type, row ) {
                if(type === 'display'){
                    return '<span id="'+data.ID+'">'+data.FullName+'</span>';
                }else if(type === 'sort'){
                    return data.LastName;
                }else{
                    return data;
                }
            }
        }
   ]
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)

jQuery DataTables 渲染列数据 的相关文章

随机推荐

  • 如何在 django 中对文件上传进行单元测试

    在我的 django 应用程序中 我有一个完成文件上传的视图 核心代码片段是这样的 if request method POST if request FILES has key file file request FILES file w
  • 如何将具有外键的表更新到 ADO.Net 实体模型中的另一个表?

    我有 2 个表 Table1 有一个主键 CustomizationId Table2 有一个与此匹配的 FK Customizationid Table2 没有主键 我正在尝试从基于网络的表单添加新记录 我尝试将其保存到数据库中 但收到错
  • Android openRawResource() 不适用于可绘制对象

    我正在尝试通过这样做来创建输入流 InputStream is InputStream getResources openRawResource R drawable image1 但我遇到了关于我的可绘制文件 R drawable ima
  • R Blogdown Hugo 学术主题未渲染站点

    我正在尝试使用 R Blogdown Hugo Academic 主题创建一个网站 通常 我会通过运行以下命令来创建一个网站 blogdown new site theme gcushen hugo academic blogdown se
  • 类型错误:需要类似字节的对象,而不是 subprocess.check_output 中的“str”

    我收到 TypeError a bytes like object is required not str 在 python3 5 的以下代码行中 path os getcwd strip n Null userprof subproces
  • TypeScript 需要进行类型检查

    我正在使用 TypeScript v1 4 1 并且希望需要一个外部模块 在本例中为 chai 并对其进行类型检查 但是 我遇到了与此代码的某种命名冲突
  • 字符串替换转义字符

    今天我发现将字符串放入资源文件中会导致它们被视为文字 即放置 第一行文本 n第二行文本 将导致转义字符本身被转义 因此存储的内容是 第一行的文本 n 第二行的文本 然后这些出现在显示屏中 而不是我的回车符和制表符 所以我想做的是使用 str
  • 无法在 VBA 中创建新枚举

    我正在 VBA 中创建一个不可变链接列表类 它提供ToArray and ToCollection方法 我已经验证这两种方法都有效 但是 那Get NewEnum As IUnknown财产不工作 我不知道为什么 Public Proper
  • 如何使用 Android UiAutomation.injectInputEvent 注入点击事件

    我正在自动测试我安装设备管理员的应用程序中的流程 要在大多数设备上激活设备管理员 假设这里没有一些企业 API 可以让我像三星提供的那样执行此操作 系统会向用户显示一个弹出窗口 然后用户必须单击 激活 按钮 我在用着Robotium和 An
  • Angular.js 说自定义 HTTP 响应标头为 null

    POST 的回调函数为我的自定义 HTTP 标头返回 nullX Auth Token Chrome 显示了正确的 POST 响应标头 但 Angular js 却没有 Angular 唯一返回的是 Cache Control 和 Cont
  • 在 AngularJS 中创建阅读更多链接

    我想创建一个包含阅读更多文本的链接 如果段落中的行数超过 3 行 则此链接应该可见 单击此链接将显示所有行 我想做同样的事情 所以我创建了一个指令 看看这里 https gist github com doukasd 0744566c549
  • 没有位置服务的 iOS 后台轮询

    这是一个我们都曾多次想知道的问题 但似乎没有人有一个好的答案 像 DataMan 这样的应用程序如何在后台定期 无限期地运行 并且仍然进入应用程序商店 该应用程序允许用户打开 精确数据跟踪 并选择应用程序在零用户交互的情况下更新其数据使用计
  • dotnetpublish 未发布正确的 appsettings.{env.EnvironmentName}.json

    当我在命令行中发出以下命令时 dotnet publish o output c Release The dotnetcli正确发布项目 然而 它并不复制appsettings Production json文件 仅appsettings
  • 如何直接在 Visual Studio 中构建 mex 文件?

    我有一个包含函数库的 Visual Studio 2010 解决方案 并且我希望能够使用 MATLAB 作为该库的几个可能的前端之一 因此 我希望 Visual Studio 在构建解决方案时自动生成 mex 文件 而不必将所有构建选项和路
  • 别名模板专业化

    别名模板 14 5 7 可以显式专门化 14 7 3 吗 我的标准 fu 失败了 我找不到编译器来测试 文本 当 template id 引用别名模板的专门化时 意味着yes 但这个例子似乎指的是其他东西 暗示no NB I m worki
  • 包含非自反元素的集合的比较

    在Python中 一个值x并不总是被限制为等于自身 也许最著名的例子是NaN gt gt gt x float NaN gt gt gt x x False 现在考虑仅包含一项的列表 我们可以考虑两个这样的列表equal当且仅当它们包含的物
  • 在 C# 中使用 Linq 或 lambda 从数据库表中获取 X 个随机元素

    我有一个包含 x 个用户的数据库 我想随机获取所有用户 然后在我的网站上写下 50 个用户 现在我只使用 take 50 并检索最新 50 个用户 我希望它从整个表中随机洗牌 50 个 有什么想法吗 这就是我的代码现在的样子 userLis
  • %r 是什么意思?

    是什么意思 r在下面的声明中 print r 1 我想我听说过 s d and f但从未听说过这个 背景 在Python中 有两个内置函数用于将对象转换为字符串 str vs repr str应该是一个友好的 人类可读的字符串 repr应该
  • 防止 JSPX 创建自关闭标签 (
    !=

    JSPX 有一个可爱的旋转副作用 div class magic div Into div class magic div 对于许多浏览器来说 即使它是有效的 XHTML 这也会导致布局混乱 因此 我求助于使用 groovy 脚本通过以下正
  • jQuery DataTables 渲染列数据

    我正在使用 jQuery DataTables 显示来自 JSON 编码的 PHP 响应的信息 JSON 响应包含对象 名称 姓名 包含 全名 姓氏 ID 我一直在使用columns以我想要的方式显示数据 但是我遇到了一个我无法弄清楚的问题